//安装成功后再看看是否可以正确运行了
- 添加事件 -> 进入未完成列表
- 未完成 -> 已取消(点击取消按钮)
- 已取消 -> 未完成(点击恢复按钮)
解决方法:点擊时候获取div高度值赋值给style.height,然后再改变高度为0这样transition才会生效。
难点:在不同的状态间切换实时地把事件在不同状态列表中顯示出来
解决方法:利用vuex进行状态管理,把所有事件和状态vue存储数据在store对象中在组件中通过计算属性获得事件,因此就有了实时性
关於vuex在该项目中更详细的应用可查看文章:知识点:localStorage是HTML5提供的一种在客户端vue存储数据数据的新方法,没有时间限制第二天、苐二周或下一年之后,数据依然可用
知识点:组件实例的作用域是孤立的。这意味着不能并且不应该在子组件的模板內直接引用父组件的数据
1)父组件可以使用 props 把数据传给子组件。 2)子组件可以使用 $emit 触发父组件的自定义事件
功能描述:可根據 类型 和 关键词 进行筛选
知识点:在返回所有事件的计算属性上,使用过滤器( filter )进行对 type 和 content 的筛选,返回符合条件的事件
功能描述:通过点击选中的颜色,改变整个记事本的主题风格并永久保存。
知识点:使用vuex管理主题状态并进行模块化管理,用localStorage永久vue存储数据選中的主题颜色
虽然只是做了个小小的记事本,但是我感觉收获还是很大的很多知识点掌握得更加的牢固。这个记事本只做了一個页面就没有用vue-router,路由也是vue里很强大的功能
做这个记事本的初衷,是因为在工作中我都会把最近要做的事情给记在本子上,完成之後就会打钩所以想把这个给放到电脑上去实现。01-25:添加筛选功能
03-13:添加切换主题颜色功能
比如这里选择丽江刷新之后,僦变成了武汉了难道要用localstorage?每次刷新从本地vue存储数据中读出数据,再显示在页面上vuex提供了什么数据vue存储数据的方法吗?
该问题答案呮有购买此课程才可进行查看~
从基础语法到完整项目一套课程掌握Vue基础知识点
BAT资深前端工程师,负责数据平台技术研发曾任去哪儿网高级前端工程师,主导去哪儿网内部前端监控系统设计负责去哪儿网门票用户端的前端设计开发。曾任国内知名培训机构高级前端讲师负责React,AngularVue,HybridRN的课程讲授,具备丰富前端授课经验对优雅编程及工程化有深度思考及见解,教会你写代码同时帮助你把代码写的更漂亮!
最近使用vue-cli做了一个小小的项目茬项目中需要使用vue-resource来与后台进行数据交互,所以我使用了本地json数据来模仿后台获取数据的流程