update radio

examples/docs/radio.md

@@ -16,16 +16,16 @@
 ## 基本用法
 
 <div class="demo-box demo-radio">
-  <el-radio class="radio" :value.sync="radio" label="单选框 A"></el-radio>
-  <el-radio class="radio" :value.sync="radio" label="单选框 B"></el-radio>
-  <el-radio class="radio" :value.sync="radio" label="单选框 C"></el-radio>
+  <el-radio class="radio" v-model="radio" label="单选框 A"></el-radio>
+  <el-radio class="radio" v-model="radio" label="单选框 B"></el-radio>
+  <el-radio class="radio" v-model="radio" label="单选框 C"></el-radio>
 </div>
 
 ```html
 <template>
-  <el-radio class="radio" :value.sync="radio" label="单选框 A"></el-radio>
-  <el-radio class="radio" :value.sync="radio" label="单选框 B"></el-radio>
-  <el-radio class="radio" :value.sync="radio" label="单选框 C"></el-radio>
+  <el-radio class="radio" v-model="radio" label="单选框 A"></el-radio>
+  <el-radio class="radio" v-model="radio" label="单选框 B"></el-radio>
+  <el-radio class="radio" v-model="radio" label="单选框 C"></el-radio>
 </template>
 
 <script>
@@ -42,7 +42,7 @@
 ## Radio Group
 
 <div class="demo-box demo-radio">
-  <el-radio-group :value.sync="radio2">
+  <el-radio-group v-model="radio2">
     <el-radio :label="9"></el-radio>
     <el-radio :label="6"></el-radio>
     <el-radio :label="3"></el-radio>
@@ -50,7 +50,7 @@
 </div>
 
 ```html
-<el-radio-group :value.sync="radio2">
+<el-radio-group v-model="radio2">
   <el-radio :label="9"></el-radio>
   <el-radio :label="6"></el-radio>
   <el-radio :label="3"></el-radio>
@@ -60,7 +60,7 @@
 ## Radio Group Button
 
 <div class="demo">
-  <el-radio-group :value.sync="radio31" size="large">
+  <el-radio-group v-model="radio31" size="large">
     <el-radio-button label="上海"></el-radio-button>
     <el-radio-button label="北京"></el-radio-button>
     <el-radio-button label="广州" :disabled="true"></el-radio-button>
@@ -68,7 +68,7 @@
   </el-radio-group>
 </div>
 <div class="demo">
-  <el-radio-group :value.sync="radio32">
+  <el-radio-group v-model="radio32">
     <el-radio-button label="上海"></el-radio-button>
     <el-radio-button label="北京"></el-radio-button>
     <el-radio-button label="广州" :disabled="true"></el-radio-button>
@@ -76,7 +76,7 @@
   </el-radio-group>
 </div>
 <div class="demo">
-  <el-radio-group :value.sync="radio33" size="small">
+  <el-radio-group v-model="radio33" size="small">
     <el-radio-button label="上海"></el-radio-button>
     <el-radio-button label="北京"></el-radio-button>
     <el-radio-button label="广州" :disabled="true"></el-radio-button>
@@ -85,19 +85,19 @@
 </div>
 
 ```html
-<el-radio-group :value.sync="radio31" size="large">
+<el-radio-group v-model="radio31" size="large">
   <el-radio-button label="上海"></el-radio-button>
   <el-radio-button label="北京"></el-radio-button>
   <el-radio-button label="广州" :disabled="true"></el-radio-button>
   <el-radio-button label="深圳"></el-radio-button>
 </el-radio-group>
-<el-radio-group :value.sync="radio32">
+<el-radio-group v-model="radio32">
   <el-radio-button label="上海"></el-radio-button>
   <el-radio-button label="北京"></el-radio-button>
   <el-radio-button label="广州" :disabled="true"></el-radio-button>
   <el-radio-button label="深圳"></el-radio-button>
 </el-radio-group>
-<el-radio-group :value.sync="radio33" size="small">
+<el-radio-group v-model="radio33" size="small">
   <el-radio-button label="上海"></el-radio-button>
   <el-radio-button label="北京"></el-radio-button>
   <el-radio-button label="广州" :disabled="true"></el-radio-button>
@@ -108,31 +108,32 @@
 ## 禁用
 
 <div class="demo-box demo-radio">
-  <el-radio disabled :value.sync="radio" label="禁用"></el-radio>
-  <el-radio disabled :value.sync="radio1" label="选中且禁用"></el-radio>
+  <el-radio disabled v-model="radio" label="禁用"></el-radio>
+  <el-radio disabled v-model="radio1" label="选中且禁用"></el-radio>
 </div>
 
 ```html
-<el-radio disabled :value.sync="radio" label="禁用"></el-radio>
-<el-radio disabled :value.sync="radio1" label="选中且禁用"></el-radio>
+<el-radio disabled v-model="radio" label="禁用"></el-radio>
+<el-radio disabled v-model="radio1" label="选中且禁用"></el-radio>
 ```
 
 
 ## Radio API
 | 参数      | 说明    | 类型      | 可选值       | 默认值   |
 |---------- |-------- |---------- |-------------  |-------- |
-| value     | 绑定值   | string  |               |         |
-| label     | 真实值   | string    |               |         |
+| value     | 绑定值   | string,number  |               |         |
+| label     | 真实值   | string,number    |               |         |
 | disabled  | 禁用    | boolean   | true, false   | false   |
 
 ## Radio Group API
 | 参数      | 说明    | 类型      | 可选值       | 默认值   |
 |---------- |-------- |---------- |-------------  |-------- |
-| value     | 绑定值   | string  |               |         |
+| value     | 绑定值   | string,number  |               |         |
 | size     | 尺寸   | string  | large, small  |         |
+| change  | 绑定值变化时触发的事件 | Function(value) |    |    |
 
 ## Radio Button API
 | 参数      | 说明    | 类型      | 可选值       | 默认值   |
 |---------- |-------- |---------- |-------------  |-------- |
-| label     | 真实值   | string  |               |         |
+| label     | 真实值   | string,number  |               |         |
 | disabled  | 禁用    | boolean   | true, false   | false   |

packages/radio/src/radio-button.vue

@@ -17,7 +17,7 @@
           return this.$parent.value;
         },
         set(newValue) {
-          this.$parent.value = newValue;
+          this.$parent.$emit('input', newValue);
         }
       }
     },
@@ -44,7 +44,7 @@
       :disabled="disabled">
     <span class="el-radio-button__inner">
       <slot></slot>
-      <template v-if="!_slotContents">{{label}}</template>
+      <template v-if="!$slots.default">{{label}}</template>
     </span>
   </label>
 </template>

packages/radio/src/radio-group.vue

@@ -4,18 +4,17 @@
   export default {
     name: 'ElRadioGroup',
 
+    componentName: 'radio-group',
+
     mixins: [emitter],
 
     props: {
-      value: {
-        default: '',
-        twoWay: true,
-        required: true
-      },
+      value: [String, Number],
       size: String
     },
     watch: {
       value(value) {
+        this.$emit('change', value);
         this.dispatch('form-item', 'el.form.change', [this.value]);
       }
     }

packages/radio/src/radio.vue

@@ -19,7 +19,7 @@
     </span>
     <span class="el-radio__label">
       <slot></slot>
-      <template v-if="!_slotContents">{{label}}</template>
+      <template v-if="!$slots.default">{{label}}</template>
     </span>
   </label>
 </template>
@@ -28,9 +28,7 @@
     name: 'ElRadio',
 
     props: {
-      value: {
-        twoWay: true
-      },
+      value: [String, Number],
       label: {
         type: [String, Number],
         required: true
@@ -43,11 +41,6 @@
         focus: false
       };
     },
-    watch: {
-      value(value) {
-        this.$emit('onchange', value);
-      }
-    },
     computed: {
       _value: {
         get() {
@@ -55,9 +48,9 @@
         },
         set(newValue) {
           if (this.value !== undefined) {
-            this.value = newValue;
+            this.$emit('input', newValue);
           } else {
-            this.$parent.value = newValue;
+            this.$parent.$emit('input', newValue);
           }
         }
       }