使用vux框架，发现this.$vux获取不到，导致Loading 组件报错怎么解决？

Question

      <div style="padding: 15px;">
            <x-button @click.native="showLoading" type="primary">显示loading(2s后关闭)</x-button>
        </div>

showLoading () {
            this.$vux.loading.show({
                text: 'Loading'
            })
            setTimeout(() => {
                this.$vux.loading.hide()
            }, 2000)
        },

提示报错：Uncaught TypeError: Cannot read property 'loading' of undefined

老铁们，帮忙看看>_<

Answer 1

import  { LoadingPlugin } from 'vux'
Vue.use(LoadingPlugin)

Answer 2

this的指向问题

setTimeout(() => {
    this.$vux.loading.hide()//this指向
}, 2000)

Answer 3

是不是 Vuex 初始化时间太晚了

Answer 4

首先在main.js中正确引入：
import { LoadingPlugin } from 'vux'
Vue.use(LoadingPlugin)

然后就是在使用的时候，注意this的使用。
在ES6的箭头语法中()=>{}这样的函数里面异步情况使用this，指向也不会有问题的。
但是如果使用的是js的函数：function () {}的情况下，如果在异步里面使用this，那么this的指向就变了，就会报这个错！

Answer 5

楼主，问题解决了吗？我也出现同样的错误