(资料图片)

需求根据权限编码禁用按钮阻止当前 dom 绑定的点击事件，禁用状态（opacity 半透明？？ 或者 display: none?? ）尝试开发环境用 Chrome 跑，一切正常，构建打包后去真机跑，按钮没控制住（用 HBX -发行-原生应用 app 制作 wgt 包）开发环境： HBX: 3.7.9 系统: MacOS: 13.0.1 （Intel）通过 directive绑定一个 v-auth指令，在标签里 v-auth="’some auth code‘" 或者 v-auth="["code1", "code2"]"在 directive的 bind和 inserted两个钩子尝试过，最终确定为 el在真机环境下，与开发环境的el不是一个玩意暂用平替方案全局 mixin 一个方法，判断权限后返回以控制当前 dom 是否可点击

// path/auth.jsfunction checkAuth(value) {if (value === "" ||(value instanceof Array && value.length === 0) ||!value) {return true;}const _value = [value].flat(); // 兼容入参为 string 和 array，拍平二维数组const authBtns = uni.getStorageSync("authBtns");if (authBtns === "*") return true;const hasPermission = _value.every((e) => authBtns.includes(e));return hasPermission;}const auth = {install(Vue) {// directive 在 app 下无法正常使用// Vue.directive("auth", {// bind(el, binding, vnode, oldVnode) {// if (!checkAuth(binding.value, el)) {// el.style.opacity = "0.3";// el.style.pointerEvents = "none";// }// },// inserted(el, binding, vnode, oldVnode) {// if (!checkAuth(binding.value, el)) {// el.style.opacity = "0.3";// el.style.pointerEvents = "none";// }// },// });// 平替方案Vue.mixin({methods: {$auth(val) {if (!checkAuth(val)) {return [{ opacity: "0.3", pointerEvents: "none" }];}return [];},},});},};// path/main.jsVue.use(auth);

vue文件中

没有权限 AUTH_CODE 别点我没有权限 CODE1&2 别点我// 多个行内 style 情况没有权限 AUTH_CODE 别点我

写在最后

官方 uni 文档写着支持 app 用 directive ，可能是我姿势不对，没用对吧。。