uniapp checkbox双向绑定
时间: 2023-11-29 07:45:33 浏览: 578
Uniapp checkbox 多选框组件 自行修改 checkbox
在uniapp中,可以通过v-model指令实现checkbox的双向绑定。具体实现步骤如下:
1. 在data中定义一个变量checked,用于存储checkbox的选中状态。
2. 在checkbox组件上使用v-model指令,将checked变量与checkbox的选中状态进行绑定。
3. 当checkbox的选中状态发生改变时,会自动更新checked变量的值。
以下是一个示例代码:
```html
<template>
<view>
<checkbox v-model="checked" :value="1">选项1</checkbox>
<checkbox v-model="checked" :value="2">选项2</checkbox>
<<checkbox v-model="checked" :value="3">选项3</checkbox>>
</view>
</template>
<script>
export default {
data() {
return {
checked: []
}
}
}
</script>
```
在上面的代码中,我们定义了一个data变量checked,用于存储checkbox的选中状态。然后在checkbox组件上使用v-model指令,将checked变量与checkbox的选中状态进行绑定。当checkbox的选中状态发生改变时,会自动更新checked变量的值。
阅读全文