VUE自定义命令F5刷新以后Failed to resolve directive

Question

VUE自定义命令F5刷新以后会报Failed to resolve directive:auth,

我要实现的功能是登陆以后获取权限，然后再通过自定义命令控制按钮是否显示，代码如下：

 store.commit(types.RIGHT,  res.body.myRight)

            console.log(store.state.rights)

            Vue.directive('auth',{

                bind:function (el,binding) {

                  var isExist = false;

                  store.state.rights.forEach(function (item) {

                    if (item===binding.value) {

                      isExist =true

                    }

                  })

                  if (!isExist) {

                    el.parentNode.removeChild(el);

                  }

                },

              update:function (el,binding) {

                var isExist = false;

                store.state.rights.forEach(function (item) {

                  if (item===binding.value) {

                    isExist =true

                  }

                })

                if (!isExist) {

                  el.parentNode.removeChild(el);

                }

              }

              }

            )

这段代码存在于登陆成功后。。。为什么每次用F5刷新页面后就会出现这个问题，UPDATE是我加的，没用，照样刷新过后出现问题，求大神解答一下。。。

Answer 1

你刷新後整個vue就是重新初始化了，你的登錄狀態當然不再存在啦，你可以配合後台用session，或者vue用localStorage來存下你的登錄狀態，每次初始化vue時先往session或localStorage裏找找登錄狀態，有就自動登錄