更新记录

1.0.0（2026-08-05） 下载此版本

首次发布

平台兼容性

uni-app(5.13)

gy-popup 径向渐变浮起弹窗

uni-app弹窗组件，中心纯白四周浅灰径向渐变，浮起缩放动画； 重点优化：插槽内部支持Canvas、拖拽手势插件，不会吞噬touch触摸事件。

特性

✅ 径向渐变遮罩，中心白，四周柔和浅灰 ✅ 浮起scale+translate入场动画 ✅ 完全不使用 pointer‑events:none，插槽内拖拽/canvas组件正常操作 ✅ 支持v-model双向绑定 ✅ ref调用close()关闭弹窗 ✅ 可自定义层级、渐变半径、灰度、动画时长 ✅ 支持小程序/H5/App‑vue

⚠️ 注意：微信小程序fixed下部分真机canvas依然偶发兼容问题；遇到拖拽异常建议页面开启 renderingMode:"mixed"。

Props

Expose

• close()：手动关闭弹窗

简单示例

<template>
  <view>
    <button @click="open = true">打开弹窗</button>

    <gy-popup v-model="open" :mask-closable="true" :z-index="1000">
      <!-- 内部可以放拖拽时钟、canvas等交互组件 -->
      <view style="width:520rpx;height:520rpx;background:#fff;border-radius:20rpx;">
        弹窗内容，支持拖拽、canvas组件
      </view>
    </gy-popup>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'
const open = ref(false)
</script>