Question

我正在尝试通过double something = computeSomething(/* some arguments */);在vue-router中访问会话，但它会弹出1个错误。调试后，我发现this.a.app是未定义的。这是我用来显示this的代码。

我曾尝试使用this代替es6语法，但是function(to, from, next) {...}仍未定义。

this

我需要进行任何配置以使我可以在vue-router中访问router.beforeEach((to, from, next) => { if (!to.meta.isPublic){ // eslint-disable-next-line console.log(this) } next() })吗？

Answer 1

是的，您可以在每个钩子之前使用访问路由器内部的“ this”，但是方式不同。路由器具有插入它的根实例

用户router.app指向“此”（Vue根实例）

 router.beforeEach((to, from, next) => {
  if (!to.meta.isPublic){
    // eslint-disable-next-line
    console.log(router.app)
  }
  next()
})

Answer 2

我最好的解决方案是使用 Vue 的 nextTick

<script> // ignore this tag, it's just for hightlight
      router.beforeEach((to, from, next) => {
        // console.info('TO', to, 'FROM', from)
         Vue.nextTick(() => {
           if (newTerm !== oldTerm) {
             router.app.getEasy(newTerm)
           }
         })

         next()
      })
</script>

在this之前在vue-router中未定义的`this`

2 个答案: