单选框 Radio
闵超 2020-12-30
# Radio 单选框
通过鼠标在一组备选项中进行单选
# 基础用法
<template>
<div>
<mc-radio v-model="radio" label="1">1</mc-radio>
<mc-radio v-model="radio" label="2">2</mc-radio>
</div>
</template>
<script>
export default {
data() {
return {
radio: "1",
};
},
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
显示代码 复制代码 复制代码
# 禁用状态
<template>
<div>
<mc-radio v-model="radio1" label="1" disabled>1</mc-radio>
<mc-radio v-model="radio1" label="2" disabled>2</mc-radio>
</div>
</template>
<script>
export default {
data() {
return {
radio1: "1",
};
},
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
显示代码 复制代码 复制代码
# 单选框组
<template>
<div>
<mc-radio-group v-model="radio2">
<mc-radio label="1">1</mc-radio>
<mc-radio label="2">2</mc-radio>
<mc-radio label="3">3</mc-radio>
<mc-radio label="4">4</mc-radio>
<mc-radio label="5" disabled>5</mc-radio>
</mc-radio-group>
</div>
</template>
<script>
export default {
data() {
return {
radio2: "1",
};
},
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
显示代码 复制代码 复制代码
# Attributes
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|---|---|---|---|---|
| disabled | 是否禁用 | Boolean | false | - |