uni-data-checkbox中v-model绑定的数据如何显示在数组中
时间: 2024-03-28 14:42:37 浏览: 79
如果你使用的是 Vue.js 框架,那么 uni-data-checkbox 组件的 v-model 绑定的数据会以数组的形式存储在你的数据模型中。具体来说,你可以在 data 函数中定义一个数组类型的变量,并将其绑定到 v-model 中,例如:
```html
<uni-data-checkbox v-model="selectedFruits" :options="fruits"></uni-data-checkbox>
```
```javascript
export default {
data() {
return {
fruits: ['apple', 'banana', 'orange'],
selectedFruits: []
}
}
}
```
在这个例子中,当用户选中或取消选中 uni-data-checkbox 中的选项时,selectedFruits 数组会相应地更新。你可以在组件外部监听 selectedFruits 数组的变化,以执行相应的操作,例如:
```javascript
export default {
data() {
return {
fruits: ['apple', 'banana', 'orange'],
selectedFruits: []
}
},
watch: {
selectedFruits: function(newVal, oldVal) {
console.log('Selected fruits:', newVal);
}
}
}
```
这样,每当用户选中或取消选中 uni-data-checkbox 中的选项时,控制台都会输出当前选中的水果数组。
阅读全文