时间:2021-05-26
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 stateconst 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 mutationsconst actions={ setOrder ({commit}, data) { commit('SET_SHIXIANG', data); }, setYes({commit},data){ commit('SET_YES',data) }}export default actions项目截图
项目运行
# install dependenciesnpm install# serve with hot reload at localhost:8080npm run dev# build for production with minificationnpm run build声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
目标使用Emberjs制作一个简单的Todo应用,实现这样一个效果:通过在文本框输入文本,创建一条代办事项,代办事项可以选择优先级,完成的事项可以删除。准备完成
页面刷新后,想保存页面未保存的数据。我们总是习惯于放在浏览器的sessionStorage和localStorage中。但是用了vue后,vuex便可以被应用了
1、说明运用技术:Vue2.0、Vux、vux-loader、vue-cli、vue-router、vuex2、效果图3、实现流程3.1搭建框架(需要安装好no
1.实现思路(1)设置锁屏密码(2)密码存localStorage(本项目已经封装h5的sessionStorage和localStorage)(3)vuex设
在vue中,可以用**Storage(sessionStorage,localStorage)**来存储token,也可以用vuex来存储(但要考虑页面刷新数据