2.5 KiB
2.5 KiB
adminMemorial 确认操作说明
本文档说明在 pages/memorial/adminMemorial.vue 中新增的确认封装与其使用方式。
目的
- 在高风险操作(全部开启、全部关闭、强制开启、强制关闭、时长归零)前弹出确认,避免误触。
- 通过 Promise 封装让调用处可以使用 async/await,编写更清晰的顺序代码。
核心封装:confirmAction
// 确认提示封装,返回是否确认
async function confirmAction(message) {
const res = await new Promise((resolve) => {
uni.showModal({
title: "确认操作",
content: message,
confirmText: "确认",
cancelText: "取消",
success: (r) => resolve(r),
});
});
return !!(res && res.confirm);
}
为何需要 Promise 包装
uni.showModal使用回调(success/fail),不能直接await。- 用
new Promise将回调转换为 Promise,调用方即可:
const ok = await confirmAction("确定要全部关闭吗?");
if (!ok) return; // 用户取消则中断后续流程
关于 !!(res && res.confirm)
res && res.confirm:若存在回调结果再读取confirm,否则为false。!!value:将任意值强制转为布尔,等价Boolean(value)。- 语义:仅当用户点击“确认”时返回
true,其他情况均为false。
已接入的高风险操作
handleAllOpen:全部开启handleAllClose:全部关闭handleForceOpen:强制开启(需选中单元)handleForceClose:强制关闭(需选中单元)handleResetDuration:时长归零(需选中单元)
接入方式统一如下(示例):
const ok = await this.confirmAction("确定要全部开启吗?");
if (!ok) return;
// 继续调用接口
可定制项(如需)
- 通过
uni.showModal的参数可定制:title:标题content:正文showCancel:是否显示取消按钮confirmText/cancelText:按钮文案confirmColor/cancelColor:按钮颜色
若需要让“取消”成为更显眼的默认选择,可调整按钮文案与颜色,或在交互上将危险操作改为二次输入确认。
错误处理(可选增强)
如需捕获弹窗失败(极少见),可在封装中补充 fail 并 reject(err),调用方用 try/catch 处理:
try {
const ok = await confirmAction("确定继续吗?");
if (!ok) return;
// ...
} catch (e) {
// 统一错误上报或提示
}