uni-app vue3 引入 store
时间: 2023-11-11 10:02:31 浏览: 45
在 uni-app 中引入 Vuex Store 有以下步骤:
1. 安装 Vuex:在项目根目录下执行 `npm install vuex --save` 命令安装 Vuex。
2. 创建 `store` 目录:在项目根目录下创建一个名为 `store` 的目录。
3. 创建一个 Vuex Store:在 `store` 目录下创建一个名为 `index.js` 的文件,并编写以下代码:
```
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const store = new Vuex.Store({
state: {
// 在这里定义状态
},
mutations: {
// 在这里定义修改状态的方法
},
actions: {
// 在这里定义异步操作
},
getters: {
// 在这里定义获取状态的方法
}
});
export default store;
```
4. 在 `main.js` 中引入 Store:在 `main.js` 中引入 `store` 并将其挂载到 Vue 实例上。
```
import Vue from 'vue';
import App from './App';
import store from './store';
Vue.config.productionTip = false;
App.mpType = 'app';
const app = new Vue({
store,
...App
});
app.$mount();
```
现在你就可以在组件中使用 Vuex Store 中的状态了。例如,在组件中获取状态:
```
import { mapState } from 'vuex';
export default {
computed: {
...mapState(['count'])
}
};
```