html中创建一个简易的事件清单

问题遇到的现象和发生背景

任务列表用list（列表）数据维护；
每一条list中数据 {msg:"任务", flag:"false"}；
任务总数用list.length表示；
未完成标识flag = false；
点击多选框时，触发change方法，更新数据的flag标志；
根据flag标志动态控制css样式；
未完成任务数量可以用计算属性实现；
点击添加按钮时，更新list列表

问题相关代码，请勿粘贴截图

我想要达到的结果

Vue实现todoList（任务计划列表）_冰雪为融的博客-CSDN博客_todolist vue 大致功能：1、在输入框中输入内容后按enter键，即可把内容添加到下面的列表中（如果内容为空则不添加）2、动态计算有几个未完成的任务3、点击复选框，实现选中或不选中效果（即完成或未完成）4、鼠标移入列表，会出现一个删除按钮，点击删除按钮即可删除该列表5、双击列表中的内容，可对列表内容进行编辑编辑完成后，按enter键完成编辑，或者当输入框失去焦点的时候也是完成编辑如果想要取消修改，按esc键即可取... https://blog.csdn.net/lhjuejiang/article/details/81040236

这个 挺常见的 百度一下 就有
todoList vue的入门案例 。
建议 自己写 ，
会这个了说明对vue 可以 很好的掌握