Form-radio单选框

el-radio的 label属性是该 radio 对应的值，若该标签中无内容，则该属性也充当 radio 按钮后的介绍。 

<!--要使用 Radio 组件，只需要设置v-model绑定变量，选中意味着变量的值为相应 Radio label属性的值，label可以是
String、Number或Boolean。-->
<el-radio v-model="radio" label="1">备选项</el-radio>
<el-radio v-model="radio" label="2">备选项</el-radio>

data () {
  return {
    radio: '2'
  };
}

<!--单选框组:适用于在多个互斥的选项中选择的场景
结合el-radio-group元素和子元素el-radio可以实现单选组，在el-radio-group中绑定v-model，在el-radio中设置好label即可，
无需再给每一个el-radio绑定变量，另外，还提供了change事件来响应变化，它会传入一个参数value。--> 
<el-radio-group v-model="radio2">
    <el-radio :label="3">备选项</el-radio>
    <el-radio :label="6">备选项</el-radio>
    <el-radio :label="9">备选项</el-radio>
  </el-radio-group>
<script>
  export default {
    data () {
      return {
        radio2: 3
      };
    }
  }
</script>

 

<!--按钮样式的单选组合。
只需要把el-radio元素换成el-radio-button元素即可，此外，Element 还提供了size属性。
如果没有设置显示的名称，名称将显示为label的值-->
<div>
  <el-radio-group v-model="radio3">
    <el-radio-button label="上海"></el-radio-button>
    <el-radio-button label="北京"></el-radio-button>
    <el-radio-button label="广州"></el-radio-button>
    <el-radio-button label="深圳"></el-radio-button>
  </el-radio-group>
</div>
<div style="margin-top: 20px">
  <el-radio-group v-model="radio4" size="medium">
    <el-radio-button label="上海" ></el-radio-button>
    <el-radio-button label="北京"></el-radio-button>
    <el-radio-button label="广州"></el-radio-button>
    <el-radio-button label="深圳"></el-radio-button>
  </el-radio-group>
</div>

<script>
  new Vue({
    el: '#app',
    data () {
      return {
        radio3: '上海',
        radio4: '上海',
        radio5: '上海',
        radio6: '上海'
      };
    }

  })
</script>

Radio Attributes

参数	说明	类型	可选值	默认值
label	Radio 的 value(与v-model绑定的变量值相等时即为选中状态)	string / number / boolean	—	—
disabled	是否禁用	boolean	—	false
border	是否显示边框	boolean	—	false
size	Radio 的尺寸，仅在 border 为真时有效	string	medium / small / mini	—

Radio-group Attributes

参数	说明	类型	可选值	默认值
size	单选框组尺寸，仅对按钮形式的 Radio 或带有边框border的 Radio 有效	string	medium / small / mini	—
disabled	是否禁用	boolean	—	false

Radio-button Attributes

参数	说明	类型	可选值	默认值
label	Radio 的 value	string / number	—	—
disabled	是否禁用	boolean	—	false