Merge remote-tracking branch 'origin/main' into feat-v3.3

pull/5820/head
tangjinzhou 2022-05-19 17:20:31 +08:00
commit c6f692222d
5 changed files with 32 additions and 18 deletions

View File

@ -4,6 +4,7 @@ import { computed, inject } from 'vue';
import type { ConfigProviderProps, CSPConfig, Direction, SizeType } from '../../config-provider'; import type { ConfigProviderProps, CSPConfig, Direction, SizeType } from '../../config-provider';
import { defaultConfigProvider } from '../../config-provider'; import { defaultConfigProvider } from '../../config-provider';
import type { VueNode } from '../type'; import type { VueNode } from '../type';
import type { ValidateMessages } from '../../form/interface';
export default ( export default (
name: string, name: string,
@ -20,6 +21,7 @@ export default (
form?: ComputedRef<{ form?: ComputedRef<{
requiredMark?: RequiredMark; requiredMark?: RequiredMark;
colon?: boolean; colon?: boolean;
validateMessages?: ValidateMessages;
}>; }>;
autoInsertSpaceInButton: ComputedRef<boolean>; autoInsertSpaceInButton: ComputedRef<boolean>;
renderEmpty?: ComputedRef<(componentName?: string) => VueNode>; renderEmpty?: ComputedRef<(componentName?: string) => VueNode>;

View File

@ -130,6 +130,7 @@ const Form = defineComponent({
const validateMessages = computed(() => { const validateMessages = computed(() => {
return { return {
...defaultValidateMessages, ...defaultValidateMessages,
...contextForm.value?.validateMessages,
...props.validateMessages, ...props.validateMessages,
}; };
}); });
@ -150,7 +151,7 @@ const Form = defineComponent({
delete fields[eventKey]; delete fields[eventKey];
}; };
const getFieldsByNameList = (nameList: NamePath[]) => { const getFieldsByNameList = (nameList: NamePath | NamePath[]) => {
const provideNameList = !!nameList; const provideNameList = !!nameList;
const namePathList = provideNameList ? toArray(nameList).map(getNamePath) : []; const namePathList = provideNameList ? toArray(nameList).map(getNamePath) : [];
if (!provideNameList) { if (!provideNameList) {
@ -162,17 +163,17 @@ const Form = defineComponent({
); );
} }
}; };
const resetFields = (name?: NamePath) => { const resetFields = (name?: NamePath | NamePath[]) => {
if (!props.model) { if (!props.model) {
warning(false, 'Form', 'model is required for resetFields to work.'); warning(false, 'Form', 'model is required for resetFields to work.');
return; return;
} }
getFieldsByNameList(name ? [name] : undefined).forEach(field => { getFieldsByNameList(name).forEach(field => {
field.resetField(); field.resetField();
}); });
}; };
const clearValidate = (name?: NamePath) => { const clearValidate = (name?: NamePath | NamePath[]) => {
getFieldsByNameList(name ? [name] : undefined).forEach(field => { getFieldsByNameList(name).forEach(field => {
field.clearValidate(); field.clearValidate();
}); });
}; };

View File

@ -57,14 +57,18 @@ A form consists of one or more form fields whose type includes input, textarea,
### Methods ### Methods
| Method | Description | Parameters | | | Method | Description | Parameters | Version |
| --- | --- | --- | --- | | --- | --- | --- | --- |
| clearValidate | clear validation message for certain fields. The parameter is name or an array of names of the form items whose validation messages will be removed. When omitted, all fields' validation messages will be cleared | Function(props: string \| array) | | | clearValidate | clear validation message for certain fields. The parameter is name or an array of names of the form items whose validation messages will be removed. When omitted, all fields' validation messages will be cleared | (nameList?: [NamePath](#NamePath)\[]) => void | |
| resetFields | reset all the fields and remove validation result | | | | resetFields | reset all the fields and remove validation result | (nameList?: [NamePath](#NamePath)\[]) => void | |
| scrollToField | Scroll to field position | (name: [NamePath](#NamePath), options: \[[ScrollOptions](https://github.com/stipsan/scroll-into-view-if-needed/tree/ece40bd9143f48caf4b99503425ecb16b0ad8249#options)]) => void | | | scrollToField | Scroll to field position | (name: [NamePath](#NamePath), options: \[[ScrollOptions](https://github.com/stipsan/scroll-into-view-if-needed/tree/ece40bd9143f48caf4b99503425ecb16b0ad8249#options)]) => void | |
| validate | Validate fields, it is same as validateFields | (nameList?: [NamePath](#NamePath)\[]) => Promise | | | validate | Validate fields, it is same as validateFields | (nameList?: [NamePath](#NamePath)\[]) => Promise | |
| validateFields | Validate fields | (nameList?: [NamePath](#NamePath)\[]) => Promise | | | validateFields | Validate fields | (nameList?: [NamePath](#NamePath)\[]) => Promise | |
#### NamePath
`string | number | (string | number)[]`
### Form.Item ### Form.Item
| Property | Description | Type | Default Value | Version | | Property | Description | Type | Default Value | Version |

View File

@ -58,13 +58,17 @@ cover: https://gw.alipayobjects.com/zos/alicdn/ORmcdeaoO/Form.svg
### 方法 ### 方法
| 方法名 | 说明 | 参数 | | | | 方法名 | 说明 | 参数 | 版本 |
| --- | --- | --- | --- | --- | | --- | --- | --- | --- |
| clearValidate | 移除表单项的校验结果。传入待移除的表单项的 name 属性或者 name 组成的数组,如不传则移除整个表单的校验结果 | Function(name: array \| string) | | | | clearValidate | 移除表单项的校验结果。传入待移除的表单项的 name 属性或者 name 组成的数组,如不传则移除整个表单的校验结果 | (nameList?: [NamePath](#NamePath)\[]) => void | |
| resetFields | 对整个表单进行重置,将所有字段值重置为初始值并移除校验结果 | — | | | | resetFields | 对整个表单进行重置,将所有字段值重置为初始值并移除校验结果 | (nameList?: [NamePath](#NamePath)\[]) => void | |
| scrollToField | 滚动到对应字段位置 | (name: [NamePath](#NamePath), options: \[[ScrollOptions](https://github.com/stipsan/scroll-into-view-if-needed/tree/ece40bd9143f48caf4b99503425ecb16b0ad8249#options)]) => void | | | | scrollToField | 滚动到对应字段位置 | (name: [NamePath](#NamePath), options: \[[ScrollOptions](https://github.com/stipsan/scroll-into-view-if-needed/tree/ece40bd9143f48caf4b99503425ecb16b0ad8249#options)]) => void | |
| validate | 触发表单验证, 同 validateFields | (nameList?: [NamePath](#NamePath)\[]) => Promise | | | | validate | 触发表单验证, 同 validateFields | (nameList?: [NamePath](#NamePath)\[]) => Promise | |
| validateFields | 触发表单验证 | (nameList?: [NamePath](#NamePath)\[]) => Promise | | | | validateFields | 触发表单验证 | (nameList?: [NamePath](#NamePath)\[]) => Promise | |
#### NamePath
`string | number | (string | number)[]`
### Form.Item ### Form.Item

View File

@ -106,15 +106,18 @@ const Select = defineComponent({
return mode; return mode;
}); });
const { prefixCls, direction, configProvider, getPrefixCls } = useConfigInject('select', props); const { prefixCls, direction, configProvider, size, getPrefixCls } = useConfigInject(
'select',
props,
);
const rootPrefixCls = computed(() => getPrefixCls()); const rootPrefixCls = computed(() => getPrefixCls());
const transitionName = computed(() => const transitionName = computed(() =>
getTransitionName(rootPrefixCls.value, 'slide-up', props.transitionName), getTransitionName(rootPrefixCls.value, 'slide-up', props.transitionName),
); );
const mergedClassName = computed(() => const mergedClassName = computed(() =>
classNames({ classNames({
[`${prefixCls.value}-lg`]: props.size === 'large', [`${prefixCls.value}-lg`]: size.value === 'large',
[`${prefixCls.value}-sm`]: props.size === 'small', [`${prefixCls.value}-sm`]: size.value === 'small',
[`${prefixCls.value}-rtl`]: direction.value === 'rtl', [`${prefixCls.value}-rtl`]: direction.value === 'rtl',
[`${prefixCls.value}-borderless`]: !props.bordered, [`${prefixCls.value}-borderless`]: !props.bordered,
}), }),