add CellSwitch component

packages/index.js

@@ -31,6 +31,7 @@ import Steps from './steps';
 import Swipe from './swipe';
 import SwipeItem from './swipe-item';
 import Switch from './switch';
+import SwitchCell from './switch-cell';
 import Tab from './tab';
 import Tabs from './tabs';
 import Tag from './tag';
@@ -70,6 +71,7 @@ const components = [
   Swipe,
   SwipeItem,
   Switch,
+  SwitchCell,
   Tab,
   Tabs,
   Tag,
@@ -125,6 +127,7 @@ export {
   Swipe,
   SwipeItem,
   Switch,
+  SwitchCell,
   Tab,
   Tabs,
   Tag,

packages/switch-cell/index.vue

@@ -0,0 +1,32 @@
+<template>
+  <van-cell :title="title" class="van-switch-cell">
+    <van-switch :value="value" @input="$emit('input', $event)" :disabled="disabled" :loading="loading" />
+  </van-cell>
+</template>
+
+<script>
+import Cell from '../cell';
+import Switch from '../switch';
+
+export default {
+  name: 'van-switch-cell',
+
+  components: {
+    [Cell.name]: Cell,
+    [Switch.name]: Switch
+  },
+
+  props: {
+    title: String,
+    value: Boolean,
+    loading: Boolean,
+    disabled: Boolean
+  },
+
+  watch: {
+    value() {
+      this.$emit('change', this.value);
+    }
+  }
+};
+</script>

packages/vant-css/src/index.css

@@ -31,3 +31,4 @@
 @import './uploader.css';
 @import './swipe.css';
 @import './notice-bar.css';
+@import './switch-cell.css';

packages/vant-css/src/switch-cell.css

@@ -0,0 +1,9 @@
+.van-switch-cell {
+  .van-cell__title {
+    vertical-align: middle;
+  }
+
+  .van-switch {
+    float: right;
+  }
+}