feat(Form): support using uploader

src/form/demo/FieldType.vue

@@ -43,6 +43,10 @@
         <van-stepper v-model="stepper" slot="input" />
       </van-field>
 
+      <van-field name="uploader" :label="$t('uploader')">
+        <van-uploader v-model="uploader" slot="input" multiple max-count="2" />
+      </van-field>
+
       <div style="margin: 16px;">
         <van-button type="info" round block>{{ $t('submit') }}</van-button>
       </div>
@@ -61,6 +65,7 @@ export default {
       slider: '滑块',
       stepper: '步进器',
       checkbox: '复选框',
+      uploader: '文件上传',
       fieldType: '表单项类型',
       checkboxGroup: '复选框组',
       requireCheckbox: '请勾选复选框',
@@ -73,6 +78,7 @@ export default {
       slider: 'Slider',
       stepper: 'Stepper',
       checkbox: 'Checkbox',
+      uploader: 'Uploader',
       fieldType: 'Field Type',
       checkboxGroup: 'Checkbox Group',
       requireCheckbox: 'Checkbox is required',
@@ -85,6 +91,7 @@ export default {
       radio: '1',
       slider: 50,
       stepper: 1,
+      uploader: [{ url: 'https://img.yzcdn.cn/vant/leaf.jpg' }],
       checkbox: false,
       checkboxGroup: [],
       switchChecked: false,

src/form/test/__snapshots__/demo.spec.js.snap

@@ -46,6 +46,29 @@ exports[`renders demo correctly 1`] = `
           </div>
         </div>
       </div>
+      <div class="van-cell van-field">
+        <div class="van-cell__title van-field__label"><span>复选框组</span></div>
+        <div class="van-cell__value van-field__value">
+          <div class="van-field__body">
+            <div class="van-field__control van-field__control--custom">
+              <div class="van-checkbox-group van-checkbox-group--horizontal">
+                <div role="checkbox" tabindex="0" aria-checked="false" class="van-checkbox van-checkbox--horizontal">
+                  <div class="van-checkbox__icon van-checkbox__icon--square"><i class="van-icon van-icon-success">
+                      <!----></i></div><span class="van-checkbox__label">
+          复选框 1
+        </span>
+                </div>
+                <div role="checkbox" tabindex="0" aria-checked="false" class="van-checkbox van-checkbox--horizontal">
+                  <div class="van-checkbox__icon van-checkbox__icon--square"><i class="van-icon van-icon-success">
+                      <!----></i></div><span class="van-checkbox__label">
+          复选框 2
+        </span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
       <div class="van-cell van-field">
         <div class="van-cell__title van-field__label"><span>单选框</span></div>
         <div class="van-cell__value van-field__value">

src/uploader/index.js

@@ -2,6 +2,9 @@
 import { createNamespace, addUnit, noop } from '../utils';
 import { toArray, readFile, isOversize, isImageFile } from './utils';
 
+// Mixins
+import { FieldMixin } from '../mixins/field';
+
 // Components
 import Icon from '../icon';
 import Image from '../image';
@@ -13,6 +16,8 @@ const [createComponent, bem] = createNamespace('uploader');
 export default createComponent({
   inheritAttrs: false,
 
+  mixins: [FieldMixin],
+
   model: {
     prop: 'fileList',
   },
@@ -70,6 +75,11 @@ export default createComponent({
     previewSizeWithUnit() {
       return addUnit(this.previewSize);
     },
+
+    // for form
+    value() {
+      return this.fileList;
+    },
   },
 
   methods: {