状态管理(vuex)的使用

简介: 状态管理(vuex)的使用
  1. 执行安装命令: npm install vuex –save
  2. 在src目录下新建一个目录store,并在该目录下创建index.js
  3. 在index.js中写入以下内容
import { createStore } from "vuex";
let store = createStore({
    state:{
        // num:0
    },
    getters:{
        // gNum(state){
        //     return state.num *10
        // }
    },
    mutations:{
        // changeNum(state,i){
        //     state.num += i
        // }
    },
    actions:{
        // aChangeNum(context,i){
        //     context.commit('changeNum',i)
        // }
    }
})
export default store

4.在main.js中引入store

import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import router  from "./router";
import store from "./store";
createApp(App).use(router).use(createPinia()).use(store).use(pinia).mount('#app')
目录
相关文章
|
22天前
|
存储 JavaScript 前端开发
除了 Vuex,还有以下一些常见的状态管理库
【10月更文挑战第18天】随着技术的不断发展和演进,新的状态管理库也可能不断涌现,我们需要保持关注和学习,以适应不断变化的开发需求。
37 1
|
6月前
|
JavaScript
状态管理(pinia)
状态管理(pinia)
46 0
|
6月前
|
存储
vuex5种状态?
vuex5种状态?
|
JavaScript API
Vuex状态管理最佳实践
使用Vuex进行状态管理时,有一些最佳实践可以帮助你保持代码清晰、可维护和高效。以下是一些详细的Vuex状态管理最佳实践
159 3
|
14天前
|
资源调度 JavaScript 前端开发
使用 Redux 进行状态管理
【10月更文挑战第26天】从定义 Action 和 Reducer,到创建 Store,再到将 Redux 与 React 组件进行连接,以及处理异步操作,Redux 提供了一种清晰、可预测的方式来管理应用程序的状态,使得应用的状态变化更加易于理解和维护,尤其适用于大型复杂的应用开发。在实际使用过程中,还可以根据项目的具体需求,进一步优化 Redux 的使用,如使用 `redux-immutable` 来处理不可变数据、使用 `redux-devtools` 进行调试等,以提高开发效率和应用性能。
32 9
|
24天前
|
存储 JavaScript
Vuex 状态管理
【10月更文挑战第15天】总的来说,Vuex 是 Vue.js 应用中非常重要的状态管理工具,它可以帮助我们更好地管理应用的状态,提高开发效率和代码质量。通过深入了解和正确使用 Vuex,我们可以构建出更加复杂和高效的 Vue.js 应用。
|
1月前
|
存储 Web App开发 监控
Vuex学习一:了解Vuex,初始用vuex,vuex状态管理图的讲解
这篇文章是关于Vuex的基本使用和状态管理的教程,包括项目搭建、Vuex配置、状态共享问题、Vuex介绍以及如何在Vue组件中使用Vuex进行状态管理。
18 0
Vuex学习一:了解Vuex,初始用vuex,vuex状态管理图的讲解
|
3月前
|
存储 JavaScript 开发者
Vuex是如何帮助我们管理状态的
Vuex通过一系列核心概念和规则,帮助我们有效地管理和维护Vue.js应用程序中的状态。
16 4
|
6月前
|
存储 JavaScript 前端开发
【第36期】一文学会Redux状态管理
【第36期】一文学会Redux状态管理
114 0
|
6月前
|
JavaScript 测试技术
状态管理:集成 Vuex 进行全局状态管理
【4月更文挑战第22天】Vuex 是 Vue.js 的状态管理库,通过状态、mutations、actions 和 modules 等核心概念集中管理应用状态。创建 store,划分模块以增强代码维护性。mutations 同步改变状态,actions 处理异步逻辑。遵循 Vuex 规范,在组件中使用辅助函数访问状态。有效更新和处理错误,实现与其它工具集成,提升应用性能和可靠性。注意根据项目需求灵活使用,防止状态管理过度复杂。
50 2