提示:本文基于对vue的学习,做一个案例,本文只是第一版,后续将对该功能不断进行优化
文章目录
前言
提示:这里可以添加本文要记录的大概内容:
在之前的学习中我们已经学习了Vue里的基本使用,本篇文章将对基于Vue的使用做一个案例
提示:以下是本篇文章正文内容
一、静态组件
app.vue
二、初始化列表
展示动态数据
三、添加一个todo
以目前的知识来看,list和header不能通信,即header组件里的topoobj不能传递给list
那么如何处理?
借助父亲来解决
处理方式:
3.1 父传子
3.2 子传父
3.3 优化处理
3.4 完善
3.5 组件间通信
四、勾选
4.1 实现
app:
myList:
MyItem:
4.2 修改写法
五、删除
六、底部统计
七、底部交互
7.1 全选
app.vue:
myfooter.vue:
优化:
myfooter.vue:
7.2 清除已完成
app.vue:
myfooter.vue