[Improvement] Checkbox: add label-position prop (#1394)

packages/checkbox/en-US.md

@@ -93,10 +93,11 @@ export default {
 
 | Attribute | Description | Type | Default |
 |-----------|-----------|-----------|-------------|
-| v-model | Check status | `Boolean` | `false` |
 | name | Checkbox name | `any` | - |
+| v-model | Check status | `Boolean` | `false` |
 | disabled | Diable checkbox | `Boolean` | `false` |
 | label-disabled | Whether to disable label click | `Boolean` | `false` |
+| label-position | Can be set to `left` | `String` | `right` |
 | shape | Can be set to `round` `square` | `String` | `round` |
 
 ### CheckboxGroup API

packages/checkbox/index.vue

@@ -10,7 +10,7 @@
       }]"
       @click="onClick"
     />
-    <span v-if="$slots.default" :class="b('label')" @click="onClick('label')">
+    <span v-if="$slots.default" :class="b('label', labelPosition)" @click="onClick('label')">
       <slot />
     </span>
   </div>
@@ -29,6 +29,7 @@ export default create({
     name: null,
     value: null,
     disabled: Boolean,
+    labelPosition: String,
     labelDisabled: {
       type: Boolean,
       default: false

packages/checkbox/zh-CN.md

@@ -97,10 +97,11 @@ export default {
 
 | 参数 | 说明 | 类型 | 默认值 |
 |-----------|-----------|-----------|-------------|
-| v-model | 是否为选中状态 | `Boolean` | `false` |
 | name | 标识 Checkbox 名称 | `any` | - |
+| v-model | 是否为选中状态 | `Boolean` | `false` |
 | disabled | 是否禁用单选框 | `Boolean` | `false` |
 | label-disabled | 是否禁用单选框内容点击 | `Boolean` | `false` |
+| label-position | 文本位置，可选值为 `left` | `String` | `right` |
 | shape | 形状，可选值为 `round` `square` | `String` | `round` |
 
 ### CheckboxGroup API

packages/vant-css/src/checkbox.css

@@ -25,6 +25,11 @@ $van-checkbox-size: 20px;
 
   &__label {
     margin-left: 10px;
+
+    &--left {
+      float: left;
+      margin: 0 10px 0 0;
+    }
   }
 
   &--round {