organizeLevelList :[1,2,3,4] <el-radio-group v-model="organizeLevelList" size="mini"> <el-radio v-for="i in organizeLevelList " :key="i.levelId" :label="i.levelId" @change="handleRadio" border>{{ i.levelName }}</el-radio> </el-radio-group> organizeLevelList=1,2 时 el-radio 为disable怎么实现
时间: 2024-03-16 07:47:33 浏览: 59
您可以使用 `:disabled` 属性来实现这个功能。在 `v-for` 循环中,可以使用计算属性来确定每个选项是否应该被禁用。例如,您可以创建一个名为 `disabledLevels` 的计算属性,它返回一个数组,其中包含应该被禁用的层级 ID。然后,在每个选项上使用 `:disabled` 属性,将其设置为 `disabledLevels` 数组中是否包含该选项的层级 ID。下面是一个示例代码:
```
<el-radio-group v-model="organizeLevelList" size="mini">
<el-radio v-for="i in organizeLevelList" :key="i.levelId" :label="i.levelId"
:disabled="disabledLevels.includes(i.levelId)"
@change="handleRadio" border>
{{ i.levelName }}
</el-radio>
</el-radio-group>
// 在组件中定义计算属性 disabledLevels
computed: {
disabledLevels() {
// 假设 organizeLevelList=1,2 时应该禁用 3 和 4 层级
return [3, 4];
}
}
```
在这个示例中,当 `organizeLevelList` 的值为 `[1, 2]` 时,选项 3 和 4 将被禁用。您可以根据实际需求修改 `disabledLevels` 计算属性的实现。
阅读全文