Vue数据选择组件设计分析

多选

事件触发时机分析

• select：当用户选择（增加）选项时触发
• change：任何选择变化时触发（增加或减少）
• clear：点击清空按钮时触发

事件触发时机说明

根据需求，组件的事件触发时机如下：

1. select事件：

   • 当用户选择（增加）一个选项时触发
   • 传递被选择的选项作为参数

2. change事件：

   • 任何选择变化时触发（增加或减少选项）
   • 减少到零时也会触发
   • 传递当前已选择的数组作为参数

3. clear事件：

   • 点击清空按钮时触发
   • 不传递参数

单选

事件触发时机分析

对于单选数据选择组件，事件触发时机如下：

1. select事件：

   • 当用户选择一个选项时触发（无论之前是否已选择其他选项）
   • 传递当前选择的选项作为参数

2. change事件：

   • 当选择的值发生变化时触发（从无到有、从有到无、从一个值变为另一个值）
   • 如果选择相同的值，则不触发change事件
   • 传递当前选择的值作为参数（未选择时为null）

3. clear事件：

   • 点击清空按钮时触发
   • 不传递参数

事件触发时机详细说明

1. select事件

   • 当用户选择一个选项时触发（无论之前是否已选择）
   • 即使选择相同的选项也会触发
   • 传递当前选择的选项作为参数

2. change事件

   • 当选择的值发生变化时触发
   • 从无到有：从未选择状态到选择某个选项
   • 从有到无：从选择某个选项到清空选择
   • 从一个值变为另一个值：选择不同的选项
   • 选择相同的选项不会触发change事件
   • 传递当前选择的值作为参数（未选择时为null）

3. clear事件

   • 点击清空按钮时触发
   • 不传递参数