用vue2.0+vuex+localStorage撸个代办事项小应用-CSDN博客

写在前面

这个demo虽然功能少，但是vuex知识点大部分都在这里面了，麻雀虽小五脏内全
应用项目地址传送门代办事项地址在这里

这是用vue2.0写的商城高仿vivo商城地址在这里

如果你觉的对你有帮助帮忙点个star谢谢感谢大佬！

前端交流群740625675 志同道合的可以加下一起学习！

代码预览

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

项目截图

项目运行

# install dependencies
npm install

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

# build for production with minification
npm run build

写在最后

前端实习生一枚，做的不好，还望大佬嘴下留情轻喷大佬我想要个star