代码之家  ›  专栏  ›  技术社区  ›  Jay Jeong

全局定义在vue.js中不起作用

  •  1
  • Jay Jeong  · 技术社区  · 6 年前

    我试着像下面那样全局地导入和定义一个库,但是不知怎么的,它不能识别全局变量。

    在main.js中,

    import Vue from 'vue'
    import App from './App'
    import router from './router'
    import VueJwtDecode from 'vue-jwt-decode'
    
    Vue.config.productionTip = false
    Vue.use(VueJwtDecode)
    
    /* eslint-disable no-new */
    new Vue({
      el: '#app',
      router,
      components: { App },
      template: '<App/>'
    })
    

    在Signup.vue中,

    ...
    const payload = VueJwtDecode.decode(res.jwt);
    ...
    

    2 回复  |  直到 6 年前
        1
  •  0
  •   David L    6 年前

    如果您试图使用的命名引用 VueJwtDecode ,您需要在Signup.vue组件中重新导入库,因为Signup.vue不了解 VUEJWT解码

    import VueJwtDecode from 'vue-jwt-decode'
    const payload = VueJwtDecode.decode(res.jwt);
    

    但是,由于您已全局安装了库,因此它已安装到Vue实例,这意味着可以从 this 组件中的上下文。因此,您也可以从组件上下文访问它,而无需重新导入:

    const payload = this.$jwtDec(res.jwt);
    
        2
  •  0
  •   ittus    6 年前

    作为 document

    this.$jwtDec(res.jwt)
    

    而不是

    VueJwtDecode.decode(res.jwt);