vue2.0+vuex+localStorage代办事项应用实现详解

网友投稿 259 2023-01-30


vue2.0+vuex+localStorage代办事项应用实现详解

vue2.0+vuex+localStorage 待办事项源码:https://github.com/Mynameisfwk/vue-Todo-list

参考代码:https://github.com/Mynameisfwk/vivo-shop

代码预览

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={

sethttp://Order ({commit}, data) {

commit('SET_SHIXIANG', data);

},

setYes({commit},data){

commit('SET_YES',data)

}

}

export default actions

项目截图

项目运行

# install dependencies

npm install

# serhttp://ve with hot reload at localhost:8080

npm run dev

# build for production with minification

npm run build


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:Vue2 轮播图slide组件实例代码
下一篇:Vue组件中prop属性使用说明实例代码详解
相关文章

 发表评论

暂时没有评论,来抢沙发吧~