几年前，刚学vue的时候，我是从todolist入手的。现在很多年过去了。今天找到了一个可以用于本地存储的vue数据库引擎。所以，又花了几个小时重新造轮子。使用bootstrap-vueUI。功能：新增、编辑、删除、自动保存直接用html写，导入的unpkg本地不启动vue。简介lowdb是一个小巧轻量级的数据库引擎，支持json、yaml和本地存储。为什么本地存储要用lowdb？由于本地存储不能直接存储对象，需要序列化，很麻烦。有了lowdb，就不用处理了，丢给它就行了。如何使用？1.获取数据lettodo=db.get('todo')如果没有数据，则返回undefined。所以拿到之后需要判断然后赋值if(todo!=undefined){this.list=todo}2.数据自动保存db.set('todo',this.list).write()运行时保存，需要自动保存，这样网页重新加载时，数据还在。核心很简单，就是用深度监控。每当数组的内容发生变化时触发。watch:{list:{handler:function(newValue,oldValue){console.log(newValue)this.save()},deep:true,//也监听数组内容的变化}}效果源码https://github。com/codetyphon/lowdb_todolist体验https://codetyphon.github.io/lowdb_todolist/index.html
