如何使用vue-konva对屏幕上的对象调用hide()？

npm install vue-konva konva

import VueKonva from 'vue-konva';
Vue.use(VueKonva);

<template>
  <v-stage :config="stageSize">
    <v-layer>
      <v-rect
        :config="rectConfig"
        ref="rect"
      ></v-rect>
    </v-layer>
  </v-stage>
</template>

export default {
  data() {
    return {
      stageSize: {
        width: 500,
        height: 500
      },
      rectConfig: {
        x: 100,
        y: 100,
        width: 200,
        height: 100,
        fill: 'red'
      }
    };
  },
  methods: {
    hideRect() {
      this.$refs.rect.getStage().findOne('Rect').hide();
      this.$refs.rect.getStage().batchDraw();
    }
  }
};

<template>
  <div>
    <button @click="hideRect">隐藏对象</button>
    <!-- 其他内容 -->
  </div>
</template>