更新记录

1.0.1（2024-10-25） 下载此版本

首次更新

平台兼容性

组件使用(下载示例项目)

功能介绍：

1️⃣ 多平台支持：

提示弹窗、确认选择弹窗

2️⃣ 组件化：

app 端显示自定义弹窗，h5 小程序端走默认弹窗。

3️⃣ 缓存策略：

支持缓存及时间控制，通过提供自定义标识 key，让同一个标识不再重复弹出，封装的接口请求必备！

1. 导入项目及配置

（1）将组件文件“/components/dialog”放入自己的项目的相同位置

项目根路径/components/dialog

（2）配置 page.json

{
  "path": "components/dialog/dialog",
  "style": {
    "navigationStyle": "custom",
    // #ifdef APP-PLUS
    "backgroundColor": "transparent",
    "backgroundColorTop": "transparent",
    "backgroundColorBottom": "transparent",
    // #endif
    "app-plus": {
      "animationType": "fade-in",
      "background": "transparent",
      "popGesture": "none"
    }
  }
}

（3）配置 App.vue

const dialog = require("@/components/dialog/dialogUtil");
export default {
  onLaunch: function () {
    uni["dialog"] = dialog;
    console.log("App Launch");
  },
  onShow: function () {
    console.log("App Show");
  },
  onHide: function () {
    console.log("App Hide");
  },
};

2.弹窗组件使用

(1)提示弹窗 alert(coifig)

示例：

uni.dialog.alert({
  title: "温馨提示",
  content: "您当前的网络不稳定，请检查网络状态",
  confirmText: "好的",
  key: "httpsApi",
  time: 30,
  confirm: () => {
    console.log("已点击确认");
  },
});

参数说明：

（2）确认弹窗 confirm(coifig)

示例：

uni.dialog.confirm({
  title: "温馨提示",
  content: "您当前的网络不稳定，请检查网络状态",
  confirmText: "好的",
  confirm: () => {
    console.log("已点击确认");
  },
  cancel: () => {
    console.log("已点击取消");
  },
});

参数说明：