简介：
第一次学习用mpvue制作小程序，官网：http://mpvue.com/，主要是通过写vue方法转换成小程序版，先看下制作后效果：
0F601AEE473A4F658BAB5054CDA46AA2.jpg
实现功能：
（1）在任务框输入任务，会在下面显示
（2）下面有完成和删除按钮
开发过程：
1、mpvue搭建项目
这个过程可以参考官网：http://mpvue.com/mpvue/quickstart/
还有：https://www.jianshu.com/p/692b2e49f33b?t=123&utm_source=oschina-app
2、搭建完成之后，就要进行代码编写：
（1）要在page文件夹中创建一个todo文件夹，里面包含：index.vue main.js main.json（可有可没有）
F6F44C3F31794599ABAD579FECEC8EC8.jpg
（2）要在app.json中添加todo
"pages/todo/main",
041D8F0AC3AE4D38BB0D7F41BD6B7456.jpg
为了开发方便，我放在第一位，这样就会一开始就显示这个页面
（3）pages/todo/index.vue页面开发：
A、添加了一个UI框架，之前一直在网上寻找适合mpvue的UI框架，但一直没找到合适的，想用VUX，但是没兼容成功，如果各位大佬有好的推荐一下。
最后找到一个，在github: https://github.com/MPComponent/mpvue-weui
官网： https://mpcomponent.github.io/mpvue-weui/ 具体使用这里就不说了
B、todo功能的实现：
template：
80BB4946252C4055A206011B25406F5E.jpg
script: 总共实现三个方法（1）往todo数组添加任务；（2）将任务的状态变成完成 （3）将任务变为已删除（不可见）
959402D3C4464348B86EEC3EC5734547.jpg
遇到的问题：
（1）小程序开发者工具点击input无法聚焦，解决办法：要长按，短按无法聚焦；
（2）使用icon图标，这里有一篇在mpvue中使用iconfont的教程：https://blog.csdn.net/weixin_39818813/article/details/80695750
（3）在写绑定样式的时候，一直报错，发现是样式没有加单引号，比如：
2AF5460A2BBA407B971223E9F3D21788.jpg
网友评论