uniapp实现手指手势放大缩小

UniApp 是一个跨平台的开发框架，可以用于开发同时支持多个平台（如 H5、小程序、App 等）的应用程序。

实现手指手势放大缩小可以通过以下步骤：

1. 在组件中监听手势事件，如 @touchstart、@touchmove 等。
2. 在事件回调函数中计算手指的位置和移动距离，以及两个手指之间的距离。
3. 根据手指移动的距离和两个手指之间的距离，计算出放大缩小的比例。
4. 根据计算出的比例，使用 CSS3 的 transform 属性来实现元素的缩放。

下面是一个简单的示例代码：

<template>
  <view class="container" 
        @touchstart="onTouchStart"
        @touchmove="onTouchMove"
        @touchend="onTouchEnd">
    <view class="box" :style="{transform: 'scale(' + scale + ')'}"></view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        startX: 0,
        startY: 0,
        distance: 0,
        scale: 1
      }
    },
    methods: {
      onTouchStart(event) {
        if (event.touches.length === 2) {
          const touch1 = event.touches
          const touch2 = event.touches
          this.startX = (touch1.pageX + touch2.pageX) / 2
          this.startY = (touch1.pageY + touch2.pageY) / 2
          this.distance = Math.sqrt(
            Math.pow(touch1.pageX - touch2.pageX, 2) + 
            Math.pow(touch1.pageY - touch2.pageY, 2)
          )
        }
      },
      onTouchMove(event) {
        if (event.touches.length === 2) {
          const touch1 = event.touches
          const touch2 = event.touches
          const endX = (touch1.pageX + touch2.pageX) / 2
          const endY = (touch1.pageY + touch2.pageY) / 2
          const newDistance = Math.sqrt(
            Math.pow(touch1.pageX - touch2.pageX, 2) + 
            Math.pow(touch1.pageY - touch2.pageY, 2)
          )
          this.scale *= newDistance / this.distance
          this.distance = newDistance
        }
      },
      onTouchEnd(event) {
        if (event.touches.length === 0) {
          this.startX = 0
          this.startY = 0
          this.distance = 0
        }
      }
    }
  }
</script>

<style>
  .container {
    position: relative;
    width: 100vw;
    height: 100vh;
    background-color: #f8f8f8;
  }
  .box {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    background-color: #e85454;
    transform-origin: center center;
    transition: all .3s ease-in-out;
  }
</style>

该示例中定义了一个 `container` 容器和一个 `box` 元素，当用户在 `box` 元素上进行手势操作时，会触发相应的事件回调函数，并根据手势移动的距离和两个手指之间的距离计算出缩放比例，并使用 `transform` 属性对 `box` 元素进行缩放。