Question

我正在尝试使用软件包Toasted，但我很难理解如何使用它。

我有一个名为TreatErrors.js的程序包，我称该程序包为基于API返回的HTTP代码（RESTful API）来处理应用程序中的所有错误。

TreatErrors.js

import toasted from 'vue-toasted';
export default {
  treatDefaultError(err){
    let statusCode = err.response.status;
    let data = err.response.data;
    for(let field in data.errors){
      if (data.errors.hasOwnProperty(field)) {
        data.errors[field].forEach(message => {
          toasted.show(message);
        })
      }
    }

    if(statusCode === 401){
      toastr.error('Your token has expired. Please logout and login again to retrieve a new token');
    }

    return null;
  },
}

，我正在尝试从此软件包中调用Toasted，但得到vue_toasted__WEBPACK_IMPORTED_MODULE_2___default.a.show is not a function。知道如何在自己定义的程序包中使用此Toasted吗？

Answer 1

vue-toasted插件必须先向Vue注册：

import Toasted from 'vue-toasted';
Vue.use(Toasted); // <-- register plugin

然后，您的模块可以通过Vue.toasted.show(...)使用它：

// TreatErrors.js
export default {
  treatDefaultError(err) {
    Vue.toasted.show(err.message);
  }
}

您的Vue组件也可以通过this.$toasted.show(...)使用它：

// Foo.vue
export default {
  methods: {
    showError(err) {
      this.$toasted.show(err.message);
    }
  }
}

如何在导出默认值{}中使用Toasted

1 个答案: