vue推荐的双向绑定路径是子组件通过emit通知父组件更新，父组件响应式修改自身数据。props只读，子组件应使用update:xxx事件通知父组件，v-model是语法糖，vue 3.4新增definemodel简化实现。
子组件不能直接改父组件的 props，但可以通过 emit 通知父组件“该更新了”，再由父组件响应式修改自身数据——这才是 Vue 推荐的双向绑定路径。
核心逻辑：emit 是“喊话”，不是“动手”
props 是只读的，子组件里写 this.xxx = newValue 会触发警告。正确做法是：
- 父组件把数据（如
searchText）以 prop 形式传给子组件 - 子组件用
emit('update:xxx', newValue)告诉父组件“我想变成这个值” - 父组件监听该事件，执行赋值操作（如
searchText = newValue） - 数据更新后，父组件重新渲染，子组件随之接收新 prop，完成同步
v-model 是语法糖，不是魔法
写 <myinput v-model="msg"></myinput> 实际等价于：
- Vue 3：
<myinput :modelvalue="msg"> msg = val" /></myinput> - Vue 2：
<myinput :value="msg"> msg = val" /></myinput>
子组件内部只需接收对应 prop（modelValue 或 value），并在输入变化时 emit 对应事件即可。
支持多个字段：v-model:xxx
一个组件可同时管理多个受控状态，比如用户名和邮箱：
- 父组件：
<userform v-model:username="name" v-model:email="mail"></userform> - 子组件声明：
defineProps({ username: String, email: String }) - 触发更新：
emit('update:username', 'Alice')或emit('update:email', 'a@b.com')
Vue 3.4 新方案：defineModel（极简替代）
不用手动声明 prop 和 emit，一行搞定：
-
const model = defineModel('modelValue')—— 自动绑定 prop 并封装 emit - 模板中直接用
v-model="model.value"，修改即自动通知父级 - 适用于简单表单类组件，大幅减少样板代码
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
