Vue组件如何用v-model和.sync实现双向绑定？

本文共计1057个文字，预计阅读时间需要5分钟。

目录 + 自定义事件 + 自定义组件的 v-model +.sync 属性 + 装饰符 + 思考 + 总结 + 自定义事件 + Tips + 推荐开始使用 + kebab-case 的事件名。（v-on 将事件名自动转换为小写，避免拼写错误）+ changeData + change-data + 自定义‘‘

目录

• 自定义事件
• 自定义组件的v-model
• .sync 修饰符
• 思考
• 总结

自定义事件

tips

• 推荐始终使用 kebab-case 的事件名。（v-on会将事件名自动转换为小写，避免匹配不到）
  • changeData ×
  • change-data √

自定义组件的v-model

• 用法：
  • 父组件定义数据源（不需要定义修改数据的方法），在子组件标签上通过v-model="data"进行传递
  • 默认传递的属性名是value,事件名为input。