I have multiple checkboxes bottom of a search button and I want to display a spesific checkbox when user enters its name. For instance:
sample image of search bar and checkbox
As shown in the image, when user enters "Positive", other checkboxes must be hidden and only "Positive" must be shown.
I have tried giving ref to checkboxes and filter input parameter inside of watch method but could not get the result. Here is my relating code:
Search bar:
<el-input v-model="searchLabelFilters" class="chart-search-tab" placeholder="Search" />
Sample checkbox:
<el-checkbox
ref="checkBoxRef"
v-model="checkedCheckBox1"
label="Positive"
size="large"
id="0"
@change="filterList('positive')"
/>
Mounted and watch methods:
mounted() {
this.checkBoxRef = this.$refs.checkBoxRef;
},
watch: {
searchLabelFilters() {
this.checkBoxRef.filter(this.searchLabelFilters);
},
},