vue2.0+vuex+localStorage代办事项应用的示例分析

这篇文章将为大家详细讲解有关vue2.0+vuex+localStorage代办事项应用的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

创新互联建站云计算的互联网服务提供商,拥有超过13年的服务器租用、联通机房服务器托管、云服务器、虚拟主机、网站系统开发经验,已先后获得国家工业和信息化部颁发的互联网数据中心业务许可证。专业提供云主机、虚拟主机主机域名、VPS主机、云服务器、香港云服务器、免备案服务器等。

代码预览

vuex官方文档 https://vuex.vuejs.org/ 我觉的官方文档说明很详细

localStorage 用来本地储存数据

const state={
 home:localStorage["home"]?JSON.parse(localStorage["home"]): [],
 item:localStorage["item"]?JSON.parse(localStorage["item"]): [],
}

export default state
const mutations={
 
 [types.SET_SHIXIANG](state,data){
  state.home.push(data)
  localStorage.setItem("home",JSON.stringify(state.home));
 },
 
 [types.SET_YES](state,data){
  state.item.push(data)
  localStorage.setItem("item",JSON.stringify(state.item));
 }
}

export default mutations
const actions={
 setOrder ({commit}, data) {
  commit('SET_SHIXIANG', data);
 },
 setYes({commit},data){
  commit('SET_YES',data)
 }
}
export default actions

项目截图

vue2.0+vuex+localStorage代办事项应用的示例分析

vue2.0+vuex+localStorage代办事项应用的示例分析

项目运行

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

关于“vue2.0+vuex+localStorage代办事项应用的示例分析”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。


当前文章:vue2.0+vuex+localStorage代办事项应用的示例分析
文章分享:http://bzwzjz.com/article/pgshhj.html

其他资讯

Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号
友情链接: 网站设计制作 企业网站设计 成都网站制作 成都企业网站设计 成都网站建设公司 品牌网站建设 攀枝花网站设计 网站制作 定制网站制作 手机网站制作 成都网站设计 专业网站设计 成都网站设计 成都企业网站制作 成都网站制作 成都商城网站制作 成都营销网站建设 四川成都网站制作 成都网站建设 高端网站设计 成都品牌网站设计 成都网站建设