vue 自定义指令控制元素的显示隐藏，切换路由，刷新页面，添加指令的元素全部消失了?

Question

vue 自定义指令控制元素的显示隐藏，切换路由，刷新页面，添加指令的元素全部消失了? 怎么改呢？
使用方式

          <el-button
              v-bt-permission="[$route.path, 'uploadBg']"></el-button>

Vue.directive("bt-permission", {
  inserted: (el: any, binding: any, vnode: any) => {
    let btnPermissionList =
      vnode.context?.$store?.getters["userStore/getBtnAccess"];
    if (btnPermissionList && typeof btnPermissionList === "string") {
      btnPermissionList = JSON.parse(btnPermissionList);
    }
    const [path, code] = binding.value; // 解构赋值获取参数
    const formatPath = getLastPartAfterSlash(path);
    const hasPermission = btnPermissionList[formatPath];

    let btnVisibility = true;
    if (hasPermission) {
      btnVisibility = hasPermission.some((item: any) => {
        return item.indexOf(code) !== -1;
      });
    } else {
      btnVisibility = false;
    }
    if (!btnVisibility) {
      el.style.display = "none";
    }
  },
});

Answer 1

应该是业务逻辑问题吧，看你的指令代码就是到 btnPermissionList 里面找界面的权限数组，然后再去界面的权限数组里面找按钮的权限，你可以在指令中调试试试，看看 formatPath,hasPermission的值以及是否可以从hasPermission中找出对应的按钮权限，如果找不到那确实是符合期望的，就不应该显示。