feat(Search): add formatter、format-trigger prop (#8441)

This commit is contained in:
neverland 2021-04-01 10:04:55 +08:00 committed by GitHub
parent d1196f885d
commit 522ce16159
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 12 additions and 4 deletions

View File

@ -253,7 +253,7 @@ Use `input-align` prop to align the input value.
| is-link | Whether to show link icon | _boolean_ | `false` |
| autofocus | Whether to auto focus, unsupported in iOS | _boolean_ | `false` |
| show-word-limit | Whether to show word limit, need to set the `maxlength` prop | _boolean_ | `false` |
| error | Whether to show error info | _boolean_ | `false` |
| error | Whether to mark the input content in red | _boolean_ | `false` |
| error-message | Error message | _string_ | - |
| formatter | Input value formatter | _(val: string) => string_ | - |
| format-trigger | When to format valuecan be set to `onBlur` | _string_ | `onChange` |

View File

@ -127,7 +127,9 @@ Use `action` slot to custom right button, `cancel` event will no longer be Emitt
| action-text | Text of action button | _boolean_ | `Cancel` |
| disabled | Whether to disable field | _boolean_ | `false` |
| readonly | Whether to be readonly | _boolean_ | `false` |
| error | Whether to show error info | _boolean_ | `false` |
| error | Whether to mark the input content in red | _boolean_ | `false` |
| formatter `v3.0.12` | Input value formatter | _(val: string) => string_ | - |
| format-trigger `v3.0.12` | When to format valuecan be set to `onBlur` | _string_ | `onChange` |
| input-align | Text align of field, can be set to `center` `right` | _string_ | `left` |
| left-icon | Left icon name | _string_ | `search` |
| right-icon | Right icon name | _string_ | - |

View File

@ -144,6 +144,8 @@ export default {
| disabled | 是否禁用输入框 | _boolean_ | `false` |
| readonly | 是否将输入框设为只读状态,只读状态下无法输入内容 | _boolean_ | `false` |
| error | 是否将输入内容标红 | _boolean_ | `false` |
| formatter `v3.0.12` | 输入内容格式化函数 | _(val: string) => string_ | - |
| format-trigger `v3.0.12` | 格式化函数触发的时机,可选值为 `onBlur` | _string_ | `onChange` |
| input-align | 输入框内容对齐方式,可选值为 `center` `right` | _string_ | `left` |
| left-icon | 输入框左侧[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `search` |
| right-icon | 输入框右侧[图标名称](#/zh-CN/icon)或图片链接 | _string_ | - |

View File

@ -15,7 +15,7 @@ import { useExpose } from '../composables/use-expose';
import { Field } from '../field';
// Types
import type { FieldClearTrigger } from '../field/types';
import type { FieldClearTrigger, FieldFormatTrigger } from '../field/types';
const [name, bem, t] = createNamespace('search');
@ -30,11 +30,13 @@ export default defineComponent({
label: String,
clearIcon: String,
rightIcon: String,
formatter: Function as PropType<(value: string) => string>,
modelValue: String,
actionText: String,
background: String,
showAction: Boolean,
clearTrigger: String as PropType<FieldClearTrigger>,
formatTrigger: String as PropType<FieldFormatTrigger>,
shape: {
type: String as PropType<SearchShape>,
default: 'square',
@ -100,10 +102,13 @@ export default defineComponent({
const fieldPropNames = [
'leftIcon',
'clearIcon',
'rightIcon',
'formatter',
'clearable',
'modelValue',
'clearTrigger',
'formatTrigger',
] as const;
const renderField = () => {
@ -122,7 +127,6 @@ export default defineComponent({
ref={filedRef}
type="search"
border={false}
clearIcon={props.clearIcon}
onKeypress={onKeypress}
{...fieldAttrs}
{...{ 'onUpdate:modelValue': onInput }}