v-model 封装自己的复选框组件
{{ checkarr }}
<my-check v-model="checkarr"></my-check>
data() {
return {
checkarr: ["a", "b"],
};
},
MyCheckBox组件
<template>
<div>
<input
type="checkbox"
:value="item"
:checked="value.includes(item)"
v-for="item in inputList"
:key="item"
@change="changeRadio"
/>
</div>
</template>
<script>
export default {
props: ["value"],
data() {
return {
inputList: ["a", "b", "c"],
};
},
mounted() {},
methods: {
changeRadio(e) {
const value = this.value.includes(e.target.value)
? this.value.filter((item) => item !== e.target.value)
: [...this.value, e.target.value];
this.$emit("input", value);
},
},
};
</script>
<style lang="scss" scoped></style>