在 Vue.js 中，`v-model` 是一种语法糖，用于在表单输入和应用状态之间创建双向数据绑定。然而，当在自定义组件中使用 `v-model` 时，其工作方式会有所不同，因为 Vue 需要一种方式来知道组件内部哪个 prop 和哪个事件应该被用来更新父组件的状态。 ### 基本用法 在自定义组件中，`v-model` 默认会利用名为 `value` 的 prop 和名为 `input` 的事件。这意味着当 `v-model` 被绑定到自定义组件时，它会自动将 value 属性传递给组件的 `value` prop，并监听 `input` 事件来更新绑定的数据。 #### 组件定义 ```vue ``` #### 使用组件 ```vue ``` ### 自定义 v-model 虽然 Vue 使用 `value` 和 `input` 作为 `v-model` 的默认 prop 和事件，但你可以通过修改组件的 `model` 选项来自定义这些名称。 #### 组件定义（自定义 model） ```vue ``` #### 使用组件（自定义 model） ```vue ``` 通过修改 `model` 选项，你可以为 `v-model` 在自定义组件中的使用提供更大的灵活性，使其能够更自然地适应各种组件类型和数据交互模式。