u-radio设置为true时自动选中
时间: 2024-12-04 20:22:45 浏览: 8
`u-radio` 是 Ant Design Vue 中的一个组件,它用于创建单选按钮。当需要在初始化时就让某个 `u-radio` 自动选中,你可以通过设置它的 `value` 属性来实现。例如,如果你有一个数组选项,可以这样做:
```html
<template>
<u-radio v-model="selectedOption" @change="handleRadioChange">
<u-radio-group>
<u-radio :key="option.id" :value="option.value" label="Option {{ option.name }}" v-for="(option, index) in options" />
</u-radio-group>
</u-radio>
</template>
<script>
export default {
data() {
return {
selectedOption: null,
options: [
{ id: 1, name: '选项1', value: true },
{ id: 2, name: '选项2', value: false },
// 更多选项...
]
};
},
methods: {
handleRadioChange(value) {
console.log('当前选择的值:', value);
}
}
};
</script>
```
在这个例子中,`options` 数组的第一个元素的 `value` 被设置为了 `true`,所以它会在页面加载时被默认选中。`v-model` 将 `selectedOption` 的值绑定到这个 `<u-radio>` 组件,当用户点击其他选项时,`selectedOption` 和 `value` 的关联将随之改变。
阅读全文