Ant Design Vue Radio属性和事件

Ant Design Vue Radio属性和事件列表

Radio属性

属性名称	说明	类型	默认值
autoFocus	自动获取焦点 <a-radio :autoFocus="true">Radio</a-radio> cdn引入js开发方式(把大写用-隔开) <a-radio :auto-focus="true">Radio</a-radio>	boolean	false
checked	设置当前项是否选中	boolean	false
defaultChecked	初始是否选中	boolean	false
value	对应的值	any	-

RadioGroup属性

属性名称	说明	类型	默认值
defaultValue	初始是否选中	any
disabled	禁选所有子radio单选器	boolean	false
name	通过设置name来区分按钮组	string	-
options	以配置形式设置子元素 string[] \| Array<{ label: string value: string disabled?: boolean }> 具体用法请看网页底部
size	控件大小，只对按钮样式生效	large \| default \| small	default
value(v-model)	设置当前选中的值	any
buttonStyle	RadioButton 按钮组的风格样式，目前有描边和填色两种风格	outline \| solid	outline

RadioGroup 事件

事件名称	说明	参数
change	选中值改变时触发事件	function(e:Event)

Radio方法

事件名称	说明
blur()	移除焦点
focus()	获取焦点

options属性例子

<template>
  <div>
    <div>
      <a-radio-group  :options="options" > 
      </a-radio-group>
    </div> 
  </div>
</template>
<script>
export default {
  data() {
    return {
      options:[
        {label:'浙江',value:'zj',disabled:false},
        {label:'江西',value:'jx',disabled:false},
        {label:'深圳',value:'jx',disabled:true}]
    };
  },
  methods: {
    onChange(e) {
      console.log(`checked = ${e.target.value}`);
    },
  },
};
</script>