未捕获的类型错误:无法在 vue 中设置未定义的属性“$offlineStorage”?

时间:2021-05-01 16:35:35

标签: javascript vue.js ionic-framework vuejs2 vuejs3

当我安装这个插件时,我在我的 vue ionic 应用程序中使用了这个插件 https://github.com/filrak/vue-offline 我遇到了这个错误

vue-offline.js?bf4e:193 Uncaught TypeError: Cannot set property '$offlineStorage' of undefined
    at Object.install (vue-offline.js?bf4e:193)
    at Object.use (runtime-core.esm-bundler.js?5c40:2945)
    at eval (main.js?56d7:139)
    at Module../src/main.js (app.js:1308)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)
    at Object.1 (app.js:1644)
    at __webpack_require__ (app.js:854)
    at checkDeferredModules (app.js:46)
    at app.js:994

我检查了 vue-offline.js 文件并知道这是因为这些行

 if (pluginOptions.storage) Vue.prototype.$offlineStorage = VueOfflineStorage;
    if (pluginOptions.mixin) Vue.mixin(VueOfflineMixin);

整个功能是这样的

var VueOfflinePlugin = {
  install: function install(Vue) {
    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
      mixin: true,
      storage: true
    };
    var pluginOptions = {
      mixin: options.mixin,
      storage: options.storage
    };
    if (pluginOptions.storage) Vue.prototype.$offlineStorage = VueOfflineStorage;
    if (pluginOptions.mixin) Vue.mixin(VueOfflineMixin);
  }
};

我在 main.js 文件中使用

const app = createApp(AppMain)
    .use(IonicVue)
    .use(router)
    .use(RouterPrefetch)
    .use(VueOffline)
    .use(store);

我在这个过程中缺少什么?

1 个答案:

答案 0 :(得分:0)

从 v2.0.8 开始,vue-offline 仅支持 Vue 2,但您的 Ionic 应用需要 Vue 3。

有一个开放的 GitHub 问题 (vue-offline#24) 需要 Vue 3 支持。您可以解决该问题,或者创建您自己的拉取请求来升级插件(请参阅 Vue 3 Migration Guide)。