vant2 全选和反选

你好！关于 Vant2 的全选和反选功能，你可以通过使用 Vant2 提供的 Checkbox 组件来实现。Checkbox 组件有一个 `check-all` 属性，可以用来实现全选功能。当 `check-all` 属性绑定一个变量时，当这个变量为真时，所有的 Checkbox会被选中，当这个变量为假时，所有的 Checkbox会被取消选中。

以下是一个示例代码，演示了如何在 Vant2 中实现全选和反选功能：

 <div>
 <van-checkbox v-model="checkAll" @change="handleCheckAllChange">全选</van-checkbox>
 <van-checkbox-group v-model="checkedList">
 <van-checkbox v-for="item in list" :key="item.id" :name="item.id">{{ item.name }}</van-checkbox>
 </van-checkbox-group>
 <button @click="handleReverseSelection">反选</button>
 </div>
</template>

<script>
export default {
 data() {
 return {
 checkAll: false,
 list: [
 { id:1, name: '选项1' },
 { id:2, name: '选项2' },
 { id:3, name: '选项3' },
 ],
 checkedList: [],
 };
 },
 methods: {
 handleCheckAllChange(checked) {
 if (checked) {
 this.checkedList = this.list.map(item => item.id);
 } else {
 this.checkedList = [];
 }
 },
 handleReverseSelection() {
 const uncheckedList = this.list.filter(item => !this.checkedList.includes(item.id));
 this.checkedList = uncheckedList.map(item => item.id);
 },
 },
};
</script>

在上面的代码中，`checkAll` 控制全选的状态，`checkedList` 是选中的 Checkbox 的值的集合。当全选的 Checkbox 被改变时，会触发 `handleCheckAllChange` 方法，根据 `checkAll` 的状态来控制 `checkedList` 的值。当点击反选按钮时，会触发 `handleReverseSelection` 方法，将未选中的 Checkbox 设置为选中状态。

希望以上信息能对你有所帮助！如有任何问题，请随时提问。