docs(Field): add basic usage document
This commit is contained in:
@@ -13,6 +13,48 @@ Vue.use(Form);
|
||||
|
||||
### Basic Usage
|
||||
|
||||
```html
|
||||
<van-form @submit="onSubmit" @failed="onFailed">
|
||||
<van-field
|
||||
v-model="username"
|
||||
name="Username"
|
||||
label="Username"
|
||||
placeholder="Username"
|
||||
:rules="[{ required: true, message: 'Username is required' }]"
|
||||
/>
|
||||
<van-field
|
||||
v-model="password"
|
||||
type="password"
|
||||
name="Password"
|
||||
label="Password"
|
||||
placeholder="Password"
|
||||
:rules="[{ required: true, message: 'Password is required' }]"
|
||||
/>
|
||||
<div style="margin: 16px;">
|
||||
<van-button round block type="info">Submit</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
username: '',
|
||||
password: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onSubmit(values) {
|
||||
console.log('submit', values);
|
||||
},
|
||||
onFailed(errorInfo) {
|
||||
console.log('failed', errorInfo);
|
||||
},
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
### Props
|
||||
|
||||
Reference in New Issue
Block a user