vue konva 放大的layer恢复原始大小，位置恢复到中心

要将Vue Konva中的Layer恢复到原始大小并将其位置恢复到中心，您可以使用以下代码：

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

<script>
export default {
  data() {
    return {
      stageConfig: {
        width: 500,
        height: 500
      },
      rectConfig: {
        x: 0,
        y: 0,
        width: 50,
        height: 50,
        fill: 'red'
      }
    }
  },
  methods: {
    resetLayer() {
      const stage = this.$refs.stage.getStage()
      const layer = this.$refs.layer.getLayer()

      // 获取层中心点坐标
      const centerX = stage.width() / 2
      const centerY = stage.height() / 2

      // 获取层当前位置和缩放比例
      const { x, y } = layer.position()
      const scale = layer.scaleX()

      // 计算恢复到原始大小所需的缩放比例
      const originalScale = 1 / scale

      // 计算恢复到中心所需的偏移量
      const offsetX = centerX - (x * originalScale)
      const offsetY = centerY - (y * originalScale)

      // 重置层的位置和缩放比例
      layer.scale({ x: originalScale, y: originalScale })
      layer.position({ x: (x * originalScale) + offsetX, y: (y * originalScale) + offsetY })
      layer.batchDraw()
    }
  }
}
</script>

在上面的代码中，我们使用`resetLayer`方法来重置层的位置和大小。首先，我们获取舞台和层的实例，然后计算中心点坐标和当前位置/缩放比例。接下来，我们计算恢复到原始大小所需的缩放比例和恢复到中心所需的偏移量。最后，我们使用`scale`和`position`方法将层的位置和大小重置为原始状态，并使用`batchDraw`方法重新绘制层。