---
name: RadioGroup
title: 单选父组件
category: 表单组件
owner: 常健驰
---

```atom 基础示例
<template>
    <view class="wrap">
        <radio-group @change="radioChange">
            <label
                a-for="(item, index) in list"
                :key="index"
                :name="item.name"
                :for="index"
            >
                <radio
                    :value="item.name"
                    :checked="item.checked"
                    :disabled="item.disabled"
                    :id="index"
                    color="#ff0000"
                >
                {{ item.name }}
                </radio>
            </label>
        </radio-group>
    </view>
</template>

<script type="config">
    {
        data: {
            list: [
                {
                    name: 'USA',
                    value: '美国'
                },
                {
                    name: 'CHN',
                    value: '中国',
                    checked: true
                },
                {
                    name: 'BRA',
                    value: '巴西'
                },
                {
                    name: 'JPN',
                    value: '日本'
                },
                {
                    name: 'ENG',
                    value: '英国',
                    disabled: true
                },
                {
                    name: 'TUR',
                    value: '法国'
                }
            ]
        },
        components: {
            'view': 'components/View/View',
            'radio-group': 'components/RadioGroup/RadioGroup',
            'radio': 'components/Radio/Radio'
        }
    }
</script>


<script>
export default {
    methods: {
        radioChange(e) {
            console.log('radio发生change事件，携带value值为：', e);
        }
    }
};
</script>
```
## API
### Props


名称 | 类型 | 默认值 | 是否必选 | 描述 | 其他
--- | --- | --- | --- | --- | ----
name | string |  | 可选 | - | -

### Slots



名称 | 描述
--- | ---
default | radio-group的自定义内容