docs: prettier all markdown files
This commit is contained in:
chenjiahan
neverland
+62
-68
@@ -25,10 +25,10 @@ The value of field is bound with v-model.
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: ''
|
||||
value: '',
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### Custom Type
|
||||
@@ -51,10 +51,10 @@ export default {
|
||||
text: '',
|
||||
digit: '',
|
||||
number: '',
|
||||
password: ''
|
||||
password: '',
|
||||
};
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### Disabled
|
||||
@@ -92,9 +92,9 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
value1: '',
|
||||
value2: '123'
|
||||
value2: '123',
|
||||
};
|
||||
}
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
@@ -126,13 +126,7 @@ Use `error` or `error-message` to show error info
|
||||
Use button slot to insert button
|
||||
|
||||
```html
|
||||
<van-field
|
||||
v-model="sms"
|
||||
center
|
||||
clearable
|
||||
label="SMS"
|
||||
placeholder="SMS"
|
||||
>
|
||||
<van-field v-model="sms" center clearable label="SMS" placeholder="SMS">
|
||||
<template #button>
|
||||
<van-button size="small" type="primary">Send SMS</van-button>
|
||||
</template>
|
||||
@@ -156,15 +150,15 @@ Use `formatter` prop to format the input value
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: ''
|
||||
value: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
formatter(value) {
|
||||
return value.replace(/\d/g, '');
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### Auto Resize
|
||||
@@ -215,67 +209,67 @@ Use `input-align` prop to align the input value
|
||||
### Props
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
|------|------|------|------|
|
||||
| v-model (value) | Field value | *number \| string* | - |
|
||||
| label | Field label | *string* | - |
|
||||
| name `v2.5.0` | Name | *string* | - |
|
||||
| type | Input type, can be set to `tel` `digit`<br>`number` `textarea` `password` | *string* | `text` |
|
||||
| size | Size，can be set to `large` | *string* | - |
|
||||
| maxlength | Max length of value | *number \| string* | - |
|
||||
| placeholder | Placeholder | *string* | - |
|
||||
| border | Whether to show inner border | *boolean* | `true` |
|
||||
| disabled | Whether to disable field | *boolean* | `false` |
|
||||
| readonly | Whether to be readonly | *boolean* | `false` |
|
||||
| required | Whether to show required mark | *boolean* | `false` |
|
||||
| clearable | Whether to be clearable | *boolean* | `false` |
|
||||
| clickable | Whether to show click feedback when clicked | *boolean* | `false` |
|
||||
| is-link | Whether to show link icon | *boolean* | `false` |
|
||||
| autofocus | Whether to auto focus, unsupported in iOS | *boolean* | `false` |
|
||||
| show-word-limit `v2.2.8` | Whether to show word limit, need to set the `maxlength` prop | *boolean* | `false` |
|
||||
| error | Whether to show error info | *boolean* | `false` |
|
||||
| error-message | Error message | *string* | - |
|
||||
| formatter `v2.4.2` | Input value formatter | *Function* | - |
|
||||
| arrow-direction `v2.0.4` | Can be set to `left` `up` `down` | *string* | `right` |
|
||||
| label-class | Label className | *any* | - |
|
||||
| label-width | Label width | *number \| string* | `90px` |
|
||||
| label-align | Label align, can be set to `center` `right` | *string* | `left` |
|
||||
| input-align | Input align, can be set to `center` `right` | *string* | `left` |
|
||||
| error-message-align | Error message align, can be set to `center` `right` | *string* | `left` |
|
||||
| autosize | Textarea auto resize，can accpet an object,<br>e.g. { maxHeight: 100, minHeight: 50 } | *boolean \| object* | `false` |
|
||||
| left-icon | Left side icon name | *string* | - |
|
||||
| right-icon | Right side icon name | *string* | - |
|
||||
| icon-prefix `v2.5.3` | Icon className prefix | *string* | `van-icon` |
|
||||
| rules `v2.5.0` | Form validation rules | *Rule[]* | - |
|
||||
| --- | --- | --- | --- |
|
||||
| v-model (value) | Field value | _number \| string_ | - |
|
||||
| label | Field label | _string_ | - |
|
||||
| name `v2.5.0` | Name | _string_ | - |
|
||||
| type | Input type, can be set to `tel` `digit`<br>`number` `textarea` `password` | _string_ | `text` |
|
||||
| size | Size，can be set to `large` | _string_ | - |
|
||||
| maxlength | Max length of value | _number \| string_ | - |
|
||||
| placeholder | Placeholder | _string_ | - |
|
||||
| border | Whether to show inner border | _boolean_ | `true` |
|
||||
| disabled | Whether to disable field | _boolean_ | `false` |
|
||||
| readonly | Whether to be readonly | _boolean_ | `false` |
|
||||
| required | Whether to show required mark | _boolean_ | `false` |
|
||||
| clearable | Whether to be clearable | _boolean_ | `false` |
|
||||
| clickable | Whether to show click feedback when clicked | _boolean_ | `false` |
|
||||
| is-link | Whether to show link icon | _boolean_ | `false` |
|
||||
| autofocus | Whether to auto focus, unsupported in iOS | _boolean_ | `false` |
|
||||
| show-word-limit `v2.2.8` | Whether to show word limit, need to set the `maxlength` prop | _boolean_ | `false` |
|
||||
| error | Whether to show error info | _boolean_ | `false` |
|
||||
| error-message | Error message | _string_ | - |
|
||||
| formatter `v2.4.2` | Input value formatter | _Function_ | - |
|
||||
| arrow-direction `v2.0.4` | Can be set to `left` `up` `down` | _string_ | `right` |
|
||||
| label-class | Label className | _any_ | - |
|
||||
| label-width | Label width | _number \| string_ | `90px` |
|
||||
| label-align | Label align, can be set to `center` `right` | _string_ | `left` |
|
||||
| input-align | Input align, can be set to `center` `right` | _string_ | `left` |
|
||||
| error-message-align | Error message align, can be set to `center` `right` | _string_ | `left` |
|
||||
| autosize | Textarea auto resize，can accpet an object,<br>e.g. { maxHeight: 100, minHeight: 50 } | _boolean \| object_ | `false` |
|
||||
| left-icon | Left side icon name | _string_ | - |
|
||||
| right-icon | Right side icon name | _string_ | - |
|
||||
| icon-prefix `v2.5.3` | Icon className prefix | _string_ | `van-icon` |
|
||||
| rules `v2.5.0` | Form validation rules | _Rule[]_ | - |
|
||||
|
||||
### Events
|
||||
|
||||
Field support all native events of input tag
|
||||
|
||||
| Event | Description | Parameters |
|
||||
|------|------|------|
|
||||
| input | Triggered when input value changed | *value: string* |
|
||||
| focus | Triggered when input gets focus | *event: Event* |
|
||||
| blur | Triggered when input loses focus | *event: Event* |
|
||||
| clear | Triggered when click clear icon | *event: Event* |
|
||||
| click | Triggered when click Field | *event: Event* |
|
||||
| click-left-icon | Triggered when click the left icon of Field | *event: Event* |
|
||||
| click-right-icon | Triggered when click the right icon of Field | *event: Event* |
|
||||
| --- | --- | --- |
|
||||
| input | Triggered when input value changed | _value: string_ |
|
||||
| focus | Triggered when input gets focus | _event: Event_ |
|
||||
| blur | Triggered when input loses focus | _event: Event_ |
|
||||
| clear | Triggered when click clear icon | _event: Event_ |
|
||||
| click | Triggered when click Field | _event: Event_ |
|
||||
| click-left-icon | Triggered when click the left icon of Field | _event: Event_ |
|
||||
| click-right-icon | Triggered when click the right icon of Field | _event: Event_ |
|
||||
|
||||
### Methods
|
||||
|
||||
Use [ref](https://vuejs.org/v2/api/#ref) to get Field instance and call instance methods
|
||||
|
||||
| Name | Description | Attribute | Return value |
|
||||
|------|------|------|------|
|
||||
| focus | Trigger input focus | - | - |
|
||||
| blur | Trigger input blur | - | - |
|
||||
| Name | Description | Attribute | Return value |
|
||||
| ----- | ------------------- | --------- | ------------ |
|
||||
| focus | Trigger input focus | - | - |
|
||||
| blur | Trigger input blur | - | - |
|
||||
|
||||
### Slots
|
||||
|
||||
| Name | Description |
|
||||
|------|------|
|
||||
| label | Custom label |
|
||||
| input | Custom input |
|
||||
| left-icon | Custom left icon |
|
||||
| Name | Description |
|
||||
| ---------- | ----------------- |
|
||||
| label | Custom label |
|
||||
| input | Custom input |
|
||||
| left-icon | Custom left icon |
|
||||
| right-icon | Custom right icon |
|
||||
| button | Insert button |
|
||||
| button | Insert button |
|
||||
|
||||
Reference in New Issue
Block a user