vue简单状态管理——store模式

.A{背景：红色的;白颜色;padding:20px;}.Ali.done{background:green;}写在前面。状态管理也是数据状态管理。vue应用程序的组件经常需要进行通信。除了v-on、EventBus等通信方式外，还可以使用数据共享。沟通的方式。这种简单的数据共享模式就是存储模式。Vue官网有简单状态管理的介绍。详见Vue状态管理。store状态管理模式的实现思路很简单。就是定义一个store对象，store对象有一个state属性用来存储共享数据，对象中也存储了操作这些共享数据的方法。.使用store.state共享数据作为组件中的部分或全部数据。当改变store.state对象中的共享数据时，必须调用store提供的接口来改变共享数据。下面是一个简单的todo-listdemo，介绍store状态管理模式1.定义store.js//store.jsexportconststore={state:{todos:[{text:'WritingChinesehomework',done:false},{text:'做数学论文',done:false}]},addTodo(str){constobj={text:str,done:false}this.state.todos.push(obj)},setDone(index){this.state.todos[index].done=true}}2.组件使用store.js//A.vue.A{背景：红色的;白颜色;padding:20px;}.Ali.done{background:green;}//B.vue.B{背景：黄色；padding:20px;}//App.vue3.实现效果可以看到，在A组件中显示的数据在B组件中进行添加和修改，就是通过数据共享来进行数据通信，简单的store模式就好这个如何使用