我們正在嘗試將 Vue 2 應用程式遷移到 Vue 2.7，但在組合 API 和 Vuex 方面存在一些問題。
在我們當前的應用程式中，我們使用@vue/composition-api包來讓我們使用可組合項。在這些可組合物中，我們需要訪問存盤，并像這樣獲取它：
...rest of the component
setup(props, { parent }) {
const store = parent.$store
someComposable({ store })
}
但是，當我們將 Vue 版本升級到 2.7 時，不再支持這種語法。我們需要使用useStoreVuex 中的可組合來訪問商店。這僅適用于 Vuex 版本 4。
在我們當前版本的 Vue 上升級 Vuex 版本 4 時，我們看到以下錯誤：
WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 14:9-15
export 'inject' (imported as 'inject') was not found in 'vue' (possible exports: default)
@ ./src/plugins/vuex.js 4:0-24 5:8-12
@ ./src/app.js 11:0-24
WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 132:14-25
export 'effectScope' (imported as 'effectScope') was not found in 'vue' (possible exports: default)
@ ./src/plugins/vuex.js 4:0-24 5:8-12
@ ./src/app.js 11:0-24
WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 140:27-35
export 'computed' (imported as 'computed') was not found in 'vue' (possible exports: default)
@ ./src/plugins/vuex.js 4:0-24 5:8-12
@ ./src/app.js 11:0-24
WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 148:17-25
export 'reactive' (imported as 'reactive') was not found in 'vue' (possible exports: default)
@ ./src/plugins/vuex.js 4:0-24 5:8-12
@ ./src/app.js 11:0-24
WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 362:2-7
export 'watch' (imported as 'watch') was not found in 'vue' (possible exports: default)
@ ./src/plugins/vuex.js 4:0-24 5:8-12
@ ./src/app.js 11:0-24
WARNING in ./node_modules/vuex/dist/vuex.esm-bundler.js 1101:9-14
export 'watch' (imported as 'watch') was not found in 'vue' (possible exports: default)
@ ./src/plugins/vuex.js 4:0-24 5:8-12
@ ./src/app.js 11:0-24
這是有道理的，因為它們是組合 API 的一部分，并且在我們使用的 Vue 版本（2.6.14）上不可用。但 Vuex 版本 4 和 Vue 版本 2.7 似乎也不能一起作業。
當我們使用 Vuex^4.1.0和 Vue運行我們的應用程式時，2.7.13我們會看到以下錯誤：
[Vue warn]: Error in render: "TypeError: this.$store is undefined"
我們如何讓 Vue 2.7 與 Vuex 和組合 API 一起作業？具體來說，我們如何在 Vue 2.7 的可組合組件中訪問 Vuex 存盤？
uj5u.com熱心網友回復：
在您的商店中：
const store = new Vuex.Store({ ...options })
export default store;
export const useStore = () => store
在任何組件中，包括子組件：
setup() {
const store = useStore();
// ...
}
如果您有多個商店，請use相應地命名商店及其功能。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/517860.html
上一篇：表格未定義問題？
下一篇：表格未定義問題？