分享给 vue 入门练手者的 todo list, 初级入坑必选……

很是适合vue初级入坑的同窗…… 总体结构简单,清晰明了。vue

主要使用了koa2 + vue 完成的一个基本的todo list。
目前只有基础的功能, 添加,标记完成,删除。mysql

git 地址

欢迎star。webpack

https://github.com/tangdaohai/todo-list-vuegit

先上图片,gif效果不太好有卡顿……

效果截图

服务端

没有使用webpack-dev-server这个插件,我的不太喜欢这种方式。github

使用了 koa2 + kao-webpack-dev-middle,kao-webpack-hot-middle 去完成启动服务与打包文件并热加载。web

vue

两个模块一个input,一个list,list使用了vue transition模块有几小动画效果。sql

两个模块经过vuex Store关联一块儿。 input commit mutations 给 store。 数据变动后自动触发 computed 相关的数据进行更新元素。vuex

没有异步运算或者请求因此未用到action后端

页面使用了flex布局,我的很是喜欢这个,用起来比较爽。缓存

webpack 相关就不说了……

小结

整个项目虽小,但都是按照vue官方建议的规范去写,我的感受代码规范性上仍是不错的……(不要喷我哦……)

这个项目有不少练手的扩展性

  1. 利用local Storage去缓存数据,持久化到本地。

  2. 在后端加mongo或者`mysql。

以上,致那颗骚动的心……
相关文章
相关标签/搜索