小黑记事本案例

新增

• 生成列表结构(v-for 数组)
• 获取用户输入(v-model)
• 回车，新增数据(v-on .enter 添加数据)

删除

• 点击删除指定内容(v-on splice)
• 数据改变和数据绑定的元素同步改变
• 事件的自定义参数
• splice方法根据索引删除指定元素

统计

• 统计信息个数（v-text length）
• 基于数据的开发方式
• v-text指令的作用

清空

• 点击清除所有数据（v-on数组）
• 基于数据的开发方式

隐藏

• 没有数据时，隐藏元素（v-show v-if 数据非空）

记事本总结

• 列表结构可以通过v-for指令结合数据生成
• v-on 结合事件修饰符可以对事件进行限制，比如 .enter
• v-on 在绑定事件时可以传递自定义参数
• 通过 v-model 可以快速的设置和获取表单元素的值
• 基于数据的开发方式