更新记录

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

全局提示模态弹窗，替换uni.showModal，已多端适配，内容自适应高度，字体大小、宽度、按钮、边距都可自定义

平台兼容性

uni-app(3.6.17)

其他

2.1 引入插件 在项目的 main.js 文件中，引入插件模块：

// main.js
import Fy from '@/common/JSSDK/kb-showModal/index.js'

2.2 全局注册 将插件方法挂载到 uni 对象上，以便全局使用：

// main.js

// ... 其他代码

// 注册全局方法

uni.kbshowModal = (e) => {
    return Fy.showModal(e)
}

// ... 创建 Vue 实例等后续代码 注意: 请确保项目配置中已正确设置 @ 别名指向 src 或项目根目录。

3. API 说明 3.1 方法名 uni.kbshowModal(options)

3.2 参数 (options)

参数名 类型  必填  默认值 说明
title   String  否   '提示'    弹窗标题
content String  否   ''  弹窗内容
success Function    否   -   接口调用成功的回调函数
fail    Function    否   -   接口调用失败的回调函数
complete    Function    否   -   接口调用结束的回调函数（调用成功、失败都会执行）
... Any 否   -   支持透传其他 uni.showModal 标准参数

3.3 返回值 返回 Fy.showModal 的执行结果（通常支持 Promise 链式调用或回调函数）。

4. 使用示例 4.1 基础用法（回调风格）

   uni.FyshowModal({
   title: '删除确认',
   content: '确定要删除这条记录吗？删除后不可恢复。',
   showCancel: true,
   cancelText: '我再想想',
   confirmText: '确认删除',
   cancelColor: '#666666',
   confirmColor: '#FF3B30',
   success: (res) => {
   if (res.confirm) {
     // 用户点击确认
     this.deleteItem()
   } else if (res.cancel) {
     // 用户点击取消
     console.log('用户取消了删除操作')
   }
   },
   fail: (err) => {
   console.error('模态框调用失败:', err)
   }
   })
   uni.kbshowModal({
   title: '提示',
   content: '这是一个自定义弹窗',
   success: (res) => {
       if (res.confirm) {
           console.log('用户点击确定');
       } else if (res.cancel) {
           console.log('用户点击取消');
       }
   }
   });
   4.2 简写用法（仅标题与成功回调）
   uni.kbshowModal({
   title: '操作成功',
   success: () => {
       console.log('弹窗关闭后的回调');
   }
   });
   4.3 Promise 风格（如果底层支持）
   async function handleAction() {
   try {
       const res = await uni.kbshowModal({
           title: '确认删除',
           content: '删除后无法恢复'
       });
   
       if (res.confirm) {
           // 执行删除逻辑
       }
   } catch (err) {
       console.error('弹窗发生错误', err);
   }
   }

5. 注意事项 路径依赖: 确保 @/common/JSSDK/kb-showModal/index.js 路径真实存在，否则编译会报错。 全局污染: 该插件将方法挂载到了 uni 全局对象上，请避免方法名 kbshowModal 与其他插件冲突。 H5 与小程序: 请测试在不同端（H5、微信小程序、App）的显示效果是否一致。 样式定制: 如需修改弹窗样式，请编辑 @/common/JSSDK/kb-showModal/index.js 源文件。