uniapp checkbox-group获取选项值非下标
时间: 2024-10-15 12:19:47 浏览: 7
在 UniApp 中,`checkbox-group` 组件主要用于创建一组复选框供用户选择。如果你想获取选中的选项而不是它们的下标,可以在绑定到数据属性时直接处理每个选项的值。例如,如果你有一个数组,存储了各个选项的名称:
```html
<view>
<checkbox-group v-model="selectedOptions">
<radio :value="item.value" v-for="(item, index) in optionsList" :key="index">{{ item.name }}</radio>
</checkbox-group>
<button @click="getSelectedOptions">获取选中项</button>
</view>
<script>
export default {
data() {
return {
optionsList: [
{ value: 'option1', name: '选项1' },
{ value: 'option2', name: '选项2' },
// 更多选项...
],
selectedOptions: []
};
},
methods: {
getSelectedOptions() {
this.selectedOptions = this.optionsList.filter(item => item.value === this.selectedOptions.includes(item.value));
}
}
};
</script>
```
在这个例子中,`v-model` 指令绑定了 `selectedOptions` 数据,当用户点击某个选项时,`getSelectedOptions` 方法会筛选出包含在 `selectedOptions` 中的所有选项的完整对象。
阅读全文