vv-model绑定复选框时使用规则和小效果

在Vue.js中，`v-model` 指令通常用于在表单 `<input>`、`<textarea>` 及 `<select>` 元素上创建双向数据绑定。当用于绑定复选框（checkbox）时，`v-model` 会根据复选框的选中状态来更新绑定的数据。

对于单个复选框，`v-model` 绑定的值是布尔值，表示复选框是否被选中。

<input type="checkbox" v-model="checked">

如果 `checked` 的初始值为 `false`，则复选框默认是未选中的。当选中复选框时，`checked` 的值会变成 `true`。

对于多个复选框，可以使用相同的 `v-model` 绑定同一个数组，然后为每个复选框添加 `value` 属性。每个复选框的 `value` 将作为数组的一个元素，当复选框被选中时，它的 `value` 会被添加到数组中；如果之前已经被选中，再次点击将从数组中移除该值。

<input type="checkbox" v-model="checkedNames" value="张三">
<input type="checkbox" v-model="checkedNames" value="李四">

在上述例子中，`checkedNames` 是一个数组，当点击任何一个复选框时，如果它未被选中，则将它的 `value` 添加到 `checkedNames` 数组中，如果已经被选中，则从数组中移除对应的 `value`。