vue3+vite使用uni-popup

要在Vue3 + Vite项目中使用uni-popup组件，需要先安装`@dcloudio/uni-ui`包：

npm install @dcloudio/uni-ui --save

然后在你的Vue组件中引入`uni-popup`组件：

<template>
  <div>
    <button @click="openPopup">打开弹窗</button>
    <uni-popup :show="showPopup" :position="position" :overlay="overlay" :animation="animation" :duration="duration" @close="onClose">
      <div>这是弹窗内容</div>
    </uni-popup>
  </div>
</template>

<script>
import { ref } from 'vue'
import { UniPopup } from '@dcloudio/uni-ui'

export default {
  components: {
    UniPopup
  },
  setup() {
    const showPopup = ref(false)
    const position = ref('center')
    const overlay = ref(true)
    const animation = ref('scale')
    const duration = ref(300)

    const openPopup = () => {
      showPopup.value = true
    }

    const onClose = () => {
      showPopup.value = false
    }

    return {
      showPopup,
      position,
      overlay,
      animation,
      duration,
      openPopup,
      onClose
    }
  }
}
</script>

在这个例子中，我们创建了一个按钮，点击按钮会打开一个弹窗。`uni-popup`组件的属性有`show`、`position`、`overlay`、`animation`和`duration`，分别控制弹窗是否显示、弹窗位置、是否显示遮罩、动画类型和动画持续时间。我们还定义了`openPopup`和`onClose`方法，分别用于打开和关闭弹窗。