fix template to jsx

Author: tangjinzhou

components/avatar/Avatar.vue

@@ -1,16 +1,3 @@
-<template>
-  <span :class="classes">
-    <img v-if="src" :src="src"/>
-    <icon v-else-if="icon" :type="icon" />
-    <span
-      v-else
-      ref="avatorChildren"
-      :class="[prefixCls+'-string']"
-      :style="childrenStyle">
-      <slot></slot>
-    </span>
-  </span>
-</template>
 <script>
 import Icon from '../icon'
 
@@ -93,8 +80,20 @@ export default {
       this.setScale()
     })
   },
-  components: {
-    Icon,
+  render () {
+    const { classes, prefixCls, src, icon, childrenStyle, $slots } = this
+    return (
+      <span class={classes}>
+        {src ? <img src={src}/>
+          : (icon ? <icon type={icon} />
+            : <span
+              ref='avatorChildren'
+              class={prefixCls + '-string'}
+              style={childrenStyle}>
+              {$slots.default}
+            </span>) }
+      </span>
+    )
   },
 }
 </script>

components/input/Group.vue

@@ -1,8 +1,3 @@
-<template>
-  <span :class="classes" >
-    <slot />
-  </span>
-</template>
 <script>
 
 export default {
@@ -32,5 +27,12 @@ export default {
   },
   methods: {
   },
+  render () {
+    return (
+      <span class={this.classes} >
+        {this.$slots.default}
+      </span>
+    )
+  },
 }
 </script>

components/radio/Radio.vue

@@ -1,17 +1,3 @@
-<template>
-  <label :class="classes">
-    <span :class="checkboxClass">
-      <input :name="name" type="radio" :disabled="disabled"
-        :class="`${prefixCls}-input`" :checked="stateChecked"
-        @change="handleChange"
-        />
-      <span :class="`${prefixCls}-inner`" />
-    </span>
-    <span v-if="hasDefaultSlot">
-      <slot></slot>
-    </span>
-  </label>
-</template>
 <script>
 import hasProp from '../_util/props-util'
 export default {
@@ -47,9 +33,6 @@ export default {
     }
   },
   computed: {
-    hasDefaultSlot () {
-      return !!this.$slots.default
-    },
     classes () {
       const { prefixCls, disabled, stateChecked } = this
       return {
@@ -103,5 +86,22 @@ export default {
       this.stateChecked = stateValue === this.value
     },
   },
+  render () {
+    const { classes, checkboxClass, disabled, prefixCls, stateChecked, handleChange, name, $slots } = this
+    return (
+      <label class={classes}>
+        <span class={checkboxClass}>
+          <input name={name} type='radio' disabled={disabled}
+            class={`${prefixCls}-input`} checked={stateChecked}
+            onChange={handleChange}
+          />
+          <span class={`${prefixCls}-inner`} />
+        </span>
+        {$slots.default ? <span>
+          {$slots.default}
+        </span> : null}
+      </label>
+    )
+  },
 }
 </script>

components/tag/CheckableTag.vue

@@ -1,8 +1,3 @@
-<template>
-  <div :class="classes" @click="handleClick">
-    <slot />
-  </div>
-</template>
 <script>
 
 export default {
@@ -34,5 +29,13 @@ export default {
       this.$emit('change', !checked)
     },
   },
+  render () {
+    const { classes, handleClick, $slots } = this
+    return (
+      <div class={classes} onClick={handleClick}>
+        {$slots.default}
+      </div>
+    )
+  },
 }
 </script>