diff --git a/components/switch/index.vue b/components/switch/index.vue
index 916dca3ae..6783d9886 100644
--- a/components/switch/index.vue
+++ b/components/switch/index.vue
@@ -1,6 +1,6 @@
 <script>
 import PropTypes from '../_util/vue-types'
-import { getOptionProps } from '../_util/props-util'
+import { getOptionProps, getComponentFromProp } from '../_util/props-util'
 import VcSwitch from '../vc-switch'
 
 export default {
@@ -22,23 +22,12 @@ export default {
     autoFocus: PropTypes.bool,
     loading: PropTypes.bool,
   },
-  monted () {
-    this.$nextTick(() => {
-      this.refSwitchNode = this.$refs.refSwitchNode
-    })
-  },
   methods: {
     focus () {
-      this.refSwitchNode.focus()
+      this.$refs.refSwitchNode.focus()
     },
     blur () {
-      this.refSwitchNode.blur()
-    },
-    getChildren () {
-      return {
-        checkedChildren: this.$slots.checkedChildren || null,
-        unCheckedChildren: this.$slots.unCheckedChildren || null,
-      }
+      this.$refs.refSwitchNode.blur()
     },
   },
 
@@ -57,17 +46,12 @@ export default {
       class: classes,
       ref: 'refSwitchNode',
     }
-    const children = this.getChildren()
     return (
       <VcSwitch
         {...switchProps}
       >
-        {children.checkedChildren ? (
-          <template slot='checkedChildren'>{children.checkedChildren}</template>
-        ) : null}
-        {children.unCheckedChildren ? (
-          <template slot='unCheckedChildren'>{children.unCheckedChildren}</template>
-        ) : null}
+        <template slot='checkedChildren'>{getComponentFromProp(this, 'checkedChildren')}</template>
+        <template slot='unCheckedChildren'>{getComponentFromProp(this, 'unCheckedChildren')}</template>
       </VcSwitch>
     )
   },
diff --git a/components/vc-switch/Switch.vue b/components/vc-switch/Switch.vue
index 3100edbfe..f99b3acc1 100644
--- a/components/vc-switch/Switch.vue
+++ b/components/vc-switch/Switch.vue
@@ -1,7 +1,7 @@
 <script>
 import { switchPropTypes } from './PropTypes'
 import BaseMixin from '../_util/BaseMixin'
-import { hasProp, filterEmpty, getOptionProps } from '../_util/props-util'
+import { hasProp, getOptionProps, getComponentFromProp } from '../_util/props-util'
 
 // function noop () {
 // }
@@ -32,13 +32,12 @@ export default {
       stateChecked: checked,
     }
   },
-  monted () {
+  mounted () {
     this.$nextTick(() => {
       const { autoFocus, disabled } = this
       if (autoFocus && !disabled) {
         this.focus()
       }
-      this.refSwitchNode = this.$refs.refSwitchNode
     })
   },
   watch: {
@@ -71,25 +70,16 @@ export default {
       }
     },
     handleMouseUp (e) {
-      if (this.refSwitchNode) {
-        this.refSwitchNode.blur()
+      if (this.$refs.refSwitchNode) {
+        this.$refs.refSwitchNode.blur()
       }
-      this.$emit('mouseUp', e)
+      this.$emit('mouseup', e)
     },
     focus () {
-      this.refSwitchNode.focus()
+      this.$refs.refSwitchNode.focus()
     },
     blur () {
-      this.refSwitchNode.blur()
-    },
-    getChildren (slotName) {
-      if (hasProp(this, slotName)) {
-        return this[slotName]
-      }
-      if (this.$slots && this.$slots[slotName]) {
-        return filterEmpty(this.$slots[slotName])
-      }
-      return null
+      this.$refs.refSwitchNode.blur()
     },
   },
   render () {
@@ -101,19 +91,24 @@ export default {
       [`${prefixCls}-checked`]: checked,
       [`${prefixCls}-disabled`]: disabled,
     }
-    const childrenType = checked ? 'checkedChildren' : 'unCheckedChildren'
+    const spanProps = {
+      props: { ...restProps },
+      on: {
+        ...this.$listeners,
+        keydown: this.handleKeyDown,
+        click: this.toggle,
+        mouseup: this.handleMouseUp,
+      },
+      attrs: {
+        tabIndex: switchTabIndex,
+      },
+      class: switchClassName,
+      ref: 'refSwitchNode',
+    }
     return (
-      <span
-        {...restProps}
-        class={switchClassName}
-        tabIndex={switchTabIndex}
-        ref='refSwitchNode'
-        onKeydown={this.handleKeyDown}
-        onClick={this.toggle}
-        onMouseup={this.handleMouseUp}
-      >
+      <span {...spanProps}>
         <span class={`${prefixCls}-inner`}>
-          {this.getChildren(childrenType)}
+          {checked ? getComponentFromProp(this, 'checkedChildren') : getComponentFromProp(this, 'unCheckedChildren')}
         </span>
       </span>
     )