学习前端,vue框架这个东西我很早就知道,今天总算有时间做一个基于vue的小案例:记事本。实现的功能:添加,删除,清空。废话不多说,我就简单记录一下做这个记事本的思路和遇到的问题。
思路:添加功能:找表单。v-model 进行数据的双向绑定,然后给表单回车提交时间,将用户输入的内容存入到一个空的数组。
删除功能:找到要生成列表结构的地方<li>。v-for 根据数据的遍历生成列表结构,然后给删除按钮添加方法,因为要删除指定索引的<li>,所以这个方法肯定是要传参的。这个方法说白了就是数组的添加,可以在①开头加 :数组名.unshift() 和②结尾追加: 数组名.push();
清空功能:将数组变为空,因为数据双向绑定,所以<li>也没了。
咳咳,毕竟是菜鸟,第一次写多多包涵。另外这个项目也是b站上面看两遍,然后自己独立写出来的。有侵权,联系我删除。