feat: add form component

src/form/README.md

@@ -0,0 +1,30 @@
+# Form
+
+### Install
+
+```js
+import Vue from 'vue';
+import { Form } from 'vant';
+
+Vue.use(Form);
+```
+
+## Usage
+
+### Basic Usage
+
+## API
+
+### Props
+
+| Attribute | Description | Type | Default |
+|------|------|------|------|
+
+### Events
+
+| Event | Description | Arguments |
+
+### Slots
+
+| Name | Description |
+|------|------|

src/form/README.zh-CN.md

@@ -0,0 +1,31 @@
+# Form 表单
+
+### 引入
+
+```js
+import Vue from 'vue';
+import { Form } from 'vant';
+
+Vue.use(Form);
+```
+
+## 代码演示
+
+### 基础用法
+
+## API
+
+### Props
+
+| 参数 | 说明 | 类型 | 默认值 |
+|------|------|------|------|
+
+### Events
+
+| 事件名 | 说明 | 回调参数 |
+|------|------|------|
+
+### Slots
+
+| 名称 | 说明 |
+|------|------|

src/form/demo/index.vue

@@ -0,0 +1,58 @@
+<template>
+  <demo-section>
+    <demo-block :title="$t('basicUsage')">
+      <van-form @submit="onSubmit">
+        <van-field
+          v-model="username"
+          name="username"
+          label="username"
+          :rules="[{ required: true, message: 'username is required' }]"
+          placeholder="username"
+        />
+        <van-field
+          v-model="password"
+          type="password"
+          name="password"
+          label="password"
+          :rules="[{ required: true, message: 'password is required' }]"
+          placeholder="password"
+        />
+        <van-field name="agree" label="agree">
+          <van-checkbox v-model="agree" slot="input" shape="square" />
+        </van-field>
+        <van-button type="primary">submit</van-button>
+      </van-form>
+    </demo-block>
+  </demo-section>
+</template>
+
+<script>
+export default {
+  i18n: {
+    'zh-CN': {},
+    'en-US': {},
+  },
+
+  data() {
+    return {
+      username: '',
+      password: '',
+      agree: true,
+    };
+  },
+
+  methods: {
+    onSubmit() {},
+  },
+};
+</script>
+
+<style lang="less">
+@import '../../style/var';
+
+.demo-form {
+  .van-button {
+    margin: 15px 0 0 15px;
+  }
+}
+</style>

src/form/index.js

@@ -0,0 +1,36 @@
+// Utils
+import { createNamespace } from '../utils';
+
+const [createComponent, bem] = createNamespace('form');
+
+export default createComponent({
+  provide() {
+    return {
+      vanForm: this,
+    };
+  },
+
+  data() {
+    return {
+      fields: [],
+    };
+  },
+
+  methods: {
+    onSubmit(event) {
+      event.preventDefault();
+
+      const results = this.fields.map(item => item.validate());
+
+      console.log(results);
+    },
+  },
+
+  render() {
+    return (
+      <form class={bem()} onSubmit={this.onSubmit}>
+        {this.slots()}
+      </form>
+    );
+  },
+});

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

@@ -0,0 +1,35 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders demo correctly 1`] = `
+<div>
+  <div>
+    <form class="van-form">
+      <div class="van-cell van-field">
+        <div class="van-cell__title van-field__label"><span>username</span></div>
+        <div class="van-cell__value">
+          <div class="van-field__body"><input type="text" name="username" placeholder="username" class="van-field__control"></div>
+        </div>
+      </div>
+      <div class="van-cell van-field">
+        <div class="van-cell__title van-field__label"><span>password</span></div>
+        <div class="van-cell__value">
+          <div class="van-field__body"><input type="password" name="password" placeholder="password" class="van-field__control"></div>
+        </div>
+      </div>
+      <div class="van-cell van-field">
+        <div class="van-cell__title van-field__label"><span>agree</span></div>
+        <div class="van-cell__value">
+          <div class="van-field__body">
+            <div class="van-field__control">
+              <div role="checkbox" tabindex="0" aria-checked="false" class="van-checkbox">
+                <div class="van-checkbox__icon van-checkbox__icon--square"><i class="van-icon van-icon-success">
+                    <!----></i></div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div> <button class="van-button van-button--primary van-button--normal"><span class="van-button__text">submit</span></button>
+    </form>
+  </div>
+</div>
+`;

src/form/test/demo.spec.js

@@ -0,0 +1,4 @@
+import Demo from '../demo';
+import { snapshotDemo } from '../../../test/demo';
+
+snapshotDemo(Demo);

src/form/test/index.spec.js

@@ -0,0 +1 @@
+// import { mount } from '../../../test';