一个
vuex
教程 主要介绍如何实际操作vuex
demo
该代码示例使用的vue相关资源 详细看package.json
核心(vue+vuex
)
其他相关参考jackblog 工程(使用了该项目的gulp和webpack配置)
一句话介绍vuex
是什么,官方说明"一个专门为 Vue.js
应用设计的状态管理架构"
状态管理: 简单理解就是统一管理和维护各个vue组件的可变化状态(你可以理解成vue
组件里的某些data
)
完成一个简单搜索查询功能 效果如下
App
主程序组件Search
搜索框组件SearchGroup
分组类型组件List
结果集合组件
(这里主要描述调用逻辑 结果都是一个list
)
App
包含了组件Search
和List
searchResultList 返回结果action 直接从
actions
获取放到list
中
Search
组件中包含子组件SearchGroup
主要包含功能
searchAction 根据key进行查询action 放大镜和回车同时绑定了事件
clearAction 清除key的值action
setSearchGroup 根据分组值进行查询action
$ npm install
启动webpack环境
npm run dev
启动一个express服务器
node server.js
npm run build
MIT