diff --git a/.ls-lint.yml b/.ls-lint.yml
index a52006845..3404b48ed 100644
--- a/.ls-lint.yml
+++ b/.ls-lint.yml
@@ -26,5 +26,6 @@ ignore:
   - packages/components/node_modules
   - packages/pro/node_modules
   - packages/site/node_modules
+  - packages/cdk/forms/src/messages
   - packages/components/i18n/src/locales
   - packages/site/components.d.ts
diff --git a/azure-pipelines.yml b/azure-pipelines.yml
index 4a8b2967b..1eecd80f6 100644
--- a/azure-pipelines.yml
+++ b/azure-pipelines.yml
@@ -17,7 +17,7 @@ stages:
           - checkout: none
           - task: NodeTool@0
             inputs:
-              versionSpec: '14.x'
+              versionSpec: '16.x'
             displayName: 'Install Node.js'
 
   - stage: lint
diff --git a/packages/cdk/forms/__tests__/abstractControl.spec.ts b/packages/cdk/forms/__tests__/abstractControl.spec.ts
index 9c3f22ed4..4bc6005e8 100644
--- a/packages/cdk/forms/__tests__/abstractControl.spec.ts
+++ b/packages/cdk/forms/__tests__/abstractControl.spec.ts
@@ -2,6 +2,7 @@ import { flushPromises } from '@vue/test-utils'
 import { Ref, ref, watch } from 'vue'
 
 import { AbstractControl } from '../src/controls'
+import { zhCNMessages } from '../src/messages/zh-CN'
 import { AsyncValidatorFn, ValidateErrors, ValidatorFn, ValidatorOptions } from '../src/types'
 import { Validators } from '../src/validators'
 
@@ -42,7 +43,7 @@ class Control<T = unknown> extends AbstractControl<T> {
 
 describe('abstractControl.ts', () => {
   describe('basic work', () => {
-    let control: Control
+    let control: AbstractControl
 
     beforeEach(() => {
       control = new Control()
@@ -71,14 +72,14 @@ describe('abstractControl.ts', () => {
       const { required, minLength, email } = Validators
       control.setValidator(required)
 
-      expect(await control.validate()).toEqual({ required: { message: undefined } })
+      expect(await control.validate()).toEqual({ required: { message: zhCNMessages.required({}, control) } })
 
       control.setValidator([email, minLength(5)])
       control.setValue('test')
 
       expect(await control.validate()).toEqual({
-        email: { message: undefined, actual: 'test' },
-        minLength: { message: undefined, minLength: 5, actual: 4 },
+        email: { actual: 'test', message: zhCNMessages.email({ actual: 'test' }, control) },
+        minLength: { actual: 4, minLength: 5, message: zhCNMessages.minLength({ actual: 4, minLength: 5 }, control) },
       })
     })
 
@@ -195,12 +196,12 @@ describe('abstractControl.ts', () => {
   })
 
   describe('convert options work', () => {
-    let control: Control
+    let control: AbstractControl
 
     test('options work', async () => {
       control = new Control({ validators: Validators.required })
 
-      expect(await control.validate()).toEqual({ required: { message: undefined } })
+      expect(await control.validate()).toEqual({ required: { message: zhCNMessages.required({}, control) } })
 
       expect(control.trigger).toEqual('change')
 
@@ -213,7 +214,7 @@ describe('abstractControl.ts', () => {
       const _asyncValidator = (_: unknown) => Promise.resolve({ async: { message: 'async' } } as ValidateErrors)
 
       control = new Control(Validators.required, _asyncValidator)
-      expect(await control.validate()).toEqual({ required: { message: undefined } })
+      expect(await control.validate()).toEqual({ required: { message: zhCNMessages.required({}, control) } })
 
       control.setValue('test')
       control.validate()
diff --git a/packages/cdk/forms/__tests__/formControl.spec.ts b/packages/cdk/forms/__tests__/formControl.spec.ts
index cf5b709fb..2d6b8882a 100644
--- a/packages/cdk/forms/__tests__/formControl.spec.ts
+++ b/packages/cdk/forms/__tests__/formControl.spec.ts
@@ -1,6 +1,7 @@
 import { flushPromises } from '@vue/test-utils'
 
 import { FormControl } from '../src/controls'
+import { zhCNMessages } from '../src/messages/zh-CN'
 import { ValidateErrors } from '../src/types'
 import { Validators } from '../src/validators'
 
@@ -67,7 +68,7 @@ describe('formControl.ts', () => {
 
       control.setValidator(Validators.required)
 
-      expect(await control.validate()).toEqual({ required: { message: undefined } })
+      expect(await control.validate()).toEqual({ required: { message: zhCNMessages.required({}, control) } })
     })
   })
 
diff --git a/packages/cdk/forms/__tests__/validators.spec.ts b/packages/cdk/forms/__tests__/validators.spec.ts
index 5ef68efa8..4316b0302 100644
--- a/packages/cdk/forms/__tests__/validators.spec.ts
+++ b/packages/cdk/forms/__tests__/validators.spec.ts
@@ -1,9 +1,10 @@
-import { AbstractControl } from '../src/controls'
+import { FormControl } from '../src/controls'
+import { zhCNMessages } from '../src/messages/zh-CN'
 import { AsyncValidatorFn, ValidateErrors, ValidateMessages, ValidatorFn } from '../src/types'
 import { Validators } from '../src/validators'
 
 describe('validators.ts', () => {
-  const control = undefined as unknown as AbstractControl
+  const control = new FormControl()
 
   test('required work', () => {
     const required = Validators.required
@@ -12,7 +13,9 @@ describe('validators.ts', () => {
     expect(required('value', control)).toBeUndefined()
     expect(required([1, 2], control)).toBeUndefined()
 
-    const errorMessage = { required: { message: undefined } }
+    const errorMessage = {
+      required: { message: zhCNMessages.required({}, control) },
+    }
     expect(required(undefined, control)).toEqual(errorMessage)
     expect(required(undefined, control)).toEqual(errorMessage)
     expect(required('', control)).toEqual(errorMessage)
@@ -24,7 +27,9 @@ describe('validators.ts', () => {
 
     expect(requiredTrue(true, control)).toBeUndefined()
 
-    const errorMessage = (actual: unknown) => ({ requiredTrue: { message: undefined, actual } })
+    const errorMessage = (actual: unknown) => ({
+      requiredTrue: { actual, message: zhCNMessages.requiredTrue({ actual }, control) },
+    })
     expect(requiredTrue(undefined, control)).toEqual(errorMessage(undefined))
     expect(requiredTrue(undefined, control)).toEqual(errorMessage(undefined))
     expect(requiredTrue('', control)).toEqual(errorMessage(''))
@@ -40,7 +45,9 @@ describe('validators.ts', () => {
     expect(email(undefined, control)).toBeUndefined()
     expect(email('test@gmail.com', control)).toBeUndefined()
 
-    const errorMessage = (actual: unknown) => ({ email: { message: undefined, actual } })
+    const errorMessage = (actual: unknown) => ({
+      email: { actual, message: zhCNMessages.email({ actual }, control) },
+    })
     expect(email({}, control)).toEqual(errorMessage({}))
     expect(email('test', control)).toEqual(errorMessage('test'))
   })
@@ -55,7 +62,9 @@ describe('validators.ts', () => {
     expect(minOne(1, control)).toBeUndefined()
     expect(minOne(2, control)).toBeUndefined()
 
-    const errorMessage = (actual: unknown) => ({ min: { message: undefined, min: 1, actual } })
+    const errorMessage = (actual: unknown) => ({
+      min: { actual, min: 1, message: zhCNMessages.min({ actual, min: 1 }, control) },
+    })
     expect(minOne(0, control)).toEqual(errorMessage(0))
     expect(minOne('0', control)).toEqual(errorMessage('0'))
   })
@@ -70,7 +79,9 @@ describe('validators.ts', () => {
     expect(maxOne(1, control)).toBeUndefined()
     expect(maxOne(0, control)).toBeUndefined()
 
-    const errorMessage = (actual: unknown) => ({ max: { message: undefined, max: 1, actual } })
+    const errorMessage = (actual: unknown) => ({
+      max: { actual, max: 1, message: zhCNMessages.max({ actual, max: 1 }, control) },
+    })
     expect(maxOne(2, control)).toEqual(errorMessage(2))
     expect(maxOne('2', control)).toEqual(errorMessage('2'))
   })
@@ -87,7 +98,9 @@ describe('validators.ts', () => {
     expect(minLengthTwo([1, 2], control)).toBeUndefined()
     expect(minLengthTwo([1, 2, 3], control)).toBeUndefined()
 
-    const errorMessage = (actual: unknown) => ({ minLength: { message: undefined, minLength: 2, actual } })
+    const errorMessage = (actual: unknown) => ({
+      minLength: { actual, minLength: 2, message: zhCNMessages.minLength({ actual, minLength: 2 }, control) },
+    })
     expect(minLengthTwo('t', control)).toEqual(errorMessage(1))
     expect(minLengthTwo([1], control)).toEqual(errorMessage(1))
   })
@@ -104,7 +117,9 @@ describe('validators.ts', () => {
     expect(maxLengthTwo([1, 2], control)).toBeUndefined()
     expect(maxLengthTwo([1], control)).toBeUndefined()
 
-    const errorMessage = (actual: unknown) => ({ maxLength: { message: undefined, maxLength: 2, actual } })
+    const errorMessage = (actual: unknown) => ({
+      maxLength: { actual, maxLength: 2, message: zhCNMessages.maxLength({ actual, maxLength: 2 }, control) },
+    })
     expect(maxLengthTwo('test', control)).toEqual(errorMessage(4))
     expect(maxLengthTwo([1, 2, 3], control)).toEqual(errorMessage(3))
   })
@@ -118,7 +133,13 @@ describe('validators.ts', () => {
     expect(stringPattern(undefined, control)).toBeUndefined()
     expect(stringPattern('test', control)).toBeUndefined()
 
-    let errorMessage = (actual: unknown) => ({ pattern: { message: undefined, pattern: '^[a-zA-Z]+$', actual } })
+    let errorMessage = (actual: unknown) => ({
+      pattern: {
+        actual,
+        pattern: '^[a-zA-Z]+$',
+        message: zhCNMessages.pattern({ actual, pattern: '^[a-zA-Z]+$' }, control),
+      },
+    })
     expect(stringPattern('test1', control)).toEqual(errorMessage('test1'))
     expect(stringPattern(1, control)).toEqual(errorMessage(1))
 
@@ -133,14 +154,26 @@ describe('validators.ts', () => {
     expect(regExpPattern('test', control)).toBeUndefined()
     expect(regExpPattern('test1', control)).toBeUndefined()
 
-    errorMessage = (actual: unknown) => ({ pattern: { message: undefined, pattern: '/[a-zA-Z]+/', actual } })
+    errorMessage = (actual: unknown) => ({
+      pattern: {
+        actual,
+        pattern: '/[a-zA-Z]+/',
+        message: zhCNMessages.pattern({ actual, pattern: '/[a-zA-Z]+/' }, control),
+      },
+    })
     expect(regExpPattern(1, control)).toEqual(errorMessage(1))
 
     const regExpPattern2 = Validators.pattern(new RegExp('^[a-zA-Z]+$'))
 
     expect(regExpPattern2('test', control)).toBeUndefined()
 
-    errorMessage = (actual: unknown) => ({ pattern: { message: undefined, pattern: '/^[a-zA-Z]+$/', actual } })
+    errorMessage = (actual: unknown) => ({
+      pattern: {
+        actual,
+        pattern: '/^[a-zA-Z]+$/',
+        message: zhCNMessages.pattern({ actual, pattern: '/^[a-zA-Z]+$/' }, control),
+      },
+    })
     expect(regExpPattern2('test1', control)).toEqual(errorMessage('test1'))
     expect(regExpPattern2(1, control)).toEqual(errorMessage(1))
   })
@@ -164,7 +197,9 @@ describe('validators.ts', () => {
       b: message2,
     })
     expect(compose([_validator('a', message1), _validator('a', message2)])!('test', control)).toEqual({ a: message2 })
-    expect(compose([undefined, nullValidator, required])!('', control)).toEqual({ required: { message: undefined } })
+    expect(compose([undefined, nullValidator, required])!('', control)).toEqual({
+      required: { message: zhCNMessages.required({}, control) },
+    })
   })
 
   test('composeAsync work', async () => {
@@ -194,11 +229,11 @@ describe('validators.ts', () => {
   test('setMessages work', () => {
     const { setMessages, required, requiredTrue } = Validators
 
-    const messages: ValidateMessages = { default: 'invalid input', required: 'please input' }
+    const messages: ValidateMessages = { required: 'please input', requiredTrue: 'invalid input' }
     setMessages(messages)
 
     expect(required('', control)).toEqual({ required: { message: messages.required } })
-    expect(requiredTrue(false, control)).toEqual({ requiredTrue: { message: messages.default, actual: false } })
+    expect(requiredTrue(false, control)).toEqual({ requiredTrue: { message: messages.requiredTrue, actual: false } })
 
     setMessages({ requiredTrue: () => 'please input true' })
 
diff --git a/packages/cdk/forms/demo/Basic.vue b/packages/cdk/forms/demo/Basic.vue
index 4507f0d80..829a51d1f 100644
--- a/packages/cdk/forms/demo/Basic.vue
+++ b/packages/cdk/forms/demo/Basic.vue
@@ -15,9 +15,8 @@
 </template>
 
 <script setup lang="ts">
-import { Validators, useFormGroup } from '@idux/cdk/forms'
+import { Validators, useFormArray, useFormGroup } from '@idux/cdk/forms'
 
-import { useFormArray } from '../src/useForms'
 import CustomForm from './CustomForm.vue'
 import CustomInput from './CustomInput.vue'
 
diff --git a/packages/cdk/forms/docs/Index.zh.md b/packages/cdk/forms/docs/Index.zh.md
index fb9c3592c..6bcc21a6c 100644
--- a/packages/cdk/forms/docs/Index.zh.md
+++ b/packages/cdk/forms/docs/Index.zh.md
@@ -89,6 +89,7 @@ export function useFormControl<T>(
 | 名称 | 说明 | 类型 | 默认值 | 备注 |
 | --- | --- | --- | --- | --- |
 | `disabled` | 默认禁用当前控件 | `boolean` | - | - |
+| `name` | 控件的名称 | `string` | - | 通常用于自定义提示信息 |
 | `trigger` | 验证器触发的时机 | `'change' \| 'blur' \| 'submit'` | `change` | - |
 | `validators` | 一个同步验证器函数或数组 | `ValidatorFn \| ValidatorFn[]` | - | - |
 | `asyncValidator` | 一个异步验证器函数或数组 | `AsyncValidatorFn \| AsyncValidatorFn[]` | - | - |
@@ -107,7 +108,9 @@ export function useFormControl<T>(
 | `minLength()` | 验证表单控件的值的长度大于或等于指定的数字 | `number` | - | 验证失败返回 `{ minLength: { message: '', minLength, actual: value.length } }`|
 | `maxLength()` | 验证表单控件的值的长度小于或等于指定的数字 | `number` | - | 验证失败返回 `{ maxLength: { message: '', maxLength, actual: value.length } }`|
 | `pattern()` | 验证表单控件的值匹配一个正则表达式 | `string \| RegExp` | - | 验证失败返回 `{ pattern: { message: '', pattern, actual: value } }`|
-| `setMessages()` | 设置验证失败的提示信息 | `ValidateMessages` | - | 每次设置的 `messages` 会跟之前的进行合并 |
+| `setMessages()` | 设置验证失败的提示信息 | `ValidateMessages` | - | 每次设置的 `messages` 会跟之前的进行合并, 默认的提示信息为 `zhCNMessages` |
+
+更多默认的提示信息，参见 [messages](https://github.com/IDuxFE/idux/tree/main/packages/cdk/forms/src/messages)
 
 ### useValueControl
 
diff --git a/packages/cdk/forms/docs/Overview.zh.md b/packages/cdk/forms/docs/Overview.zh.md
index 59786f782..ee0e0d589 100644
--- a/packages/cdk/forms/docs/Overview.zh.md
+++ b/packages/cdk/forms/docs/Overview.zh.md
@@ -7,8 +7,8 @@
 
 - `AbstractControl`: 它提供了一些所有控件和控件组共有的行为，比如运行验证器、计算状态和重置状态，还定义了一些所有子类共享的属性，如 `value`、`status`。它是 `FormControl`、`FormGroup` 和 `FormArray` 的基类,不允许直接实例化它。
 - `FormControl`: 它用于跟踪独立表单控件的值和验证状态，实现了关于访问值、验证状态、用户交互和事件的大部分基本功能。
-- `FormGroup`: 它用于跟踪一组控件实例的值和有效性状态，它把每个子控件的值聚合进一个数组，它的 `index` 是每个控件的名字。它通过归集其子控件的状态值来计算出自己的状态。 比如，如果组中的任何一个控件是无效的，那么整个组就是无效的。
-- `AbstractControl`: 它用于跟踪一个控件数组实例的值和有效性状态，它把每个子控件的值聚合进一个对象，它的 `key` 是每个控件的名字。它通过归集其子控件的状态值来计算出自己的状态。 比如，如果数组中的任何一个控件是无效的，那么整个数组就是无效的。
+- `FormGroup`: 它用于跟踪一组控件实例的值和有效性状态，它把每个子控件的值聚合进一个对象。它通过归集其子控件的状态值来计算出自己的状态。 比如，如果组中的任何一个控件是无效的，那么整个组就是无效的。
+- `FormArray`: 它用于跟踪一个控件数组实例的值和有效性状态，它把每个子控件的值聚合进一个数组。它通过归集其子控件的状态值来计算出自己的状态。 比如，如果数组中的任何一个控件是无效的，那么整个数组就是无效的。
 
 ### 实现支持控制器的输入控件
 
@@ -344,8 +344,7 @@ export declare abstract class AbstractControl<T = any> {
    * @param options Configuration options that emits events when the value changes.
    * * `dirty`: Marks it dirty, default is false.
    */
-  abstract setValue(value: T, options?: { dirty?: boolean }): void;
-  abstract setValue(value: Partial<T>, options?: { dirty?: boolean }): void;
+  abstract setValue(value: T | Partial<T>, options?: { dirty?: boolean }): void;
   /**
    * The aggregate value of the control.
    */
diff --git a/packages/cdk/forms/index.ts b/packages/cdk/forms/index.ts
index 683129025..7fc1d1d27 100644
--- a/packages/cdk/forms/index.ts
+++ b/packages/cdk/forms/index.ts
@@ -11,3 +11,8 @@ export * from './src/types'
 export * from './src/useForms'
 export * from './src/utils'
 export * from './src/validators'
+
+// messages
+
+export * from './src/messages/zh-CN'
+export * from './src/messages/en-US'
diff --git a/packages/cdk/forms/src/controls.ts b/packages/cdk/forms/src/controls.ts
index 20dda7a30..b2161d64c 100644
--- a/packages/cdk/forms/src/controls.ts
+++ b/packages/cdk/forms/src/controls.ts
@@ -56,7 +56,7 @@ export abstract class AbstractControl<T = any> {
   /**
    * A collection of child controls.
    */
-  readonly controls!: ComputedRef<GroupControls<T> | AbstractControl<ArrayElement<T>>[] | undefined>
+  readonly controls!: ComputedRef<any>
 
   /**
    * The ref value for the control.
@@ -145,7 +145,9 @@ export abstract class AbstractControl<T = any> {
     return this._trigger ?? this._parent?.trigger ?? 'change'
   }
 
-  protected _controls: Ref<GroupControls<T> | AbstractControl<ArrayElement<T>>[] | undefined>
+  name?: string
+
+  protected _controls: Ref<any>
   protected _valueRef!: Ref<T>
   protected _status!: Ref<ValidateStatus>
   protected _controlsStatus!: Ref<ValidateStatus>
@@ -179,8 +181,7 @@ export abstract class AbstractControl<T = any> {
    * @param options Configuration options that emits events when the value changes.
    * * `dirty`: Marks it dirty, default is false.
    */
-  abstract setValue(value: T, options?: { dirty?: boolean }): void
-  abstract setValue(value: Partial<T>, options?: { dirty?: boolean }): void
+  abstract setValue(value: T | Partial<T>, options?: { dirty?: boolean }): void
 
   /**
    * The aggregate value of the control.
@@ -425,6 +426,7 @@ export abstract class AbstractControl<T = any> {
   ) {
     let disabled = false
     if (isOptions(validatorOrOptions)) {
+      this.name = validatorOrOptions.name
       this._trigger = validatorOrOptions.trigger ?? this._trigger
       this._validators = toValidator(validatorOrOptions.validators)
       this._asyncValidators = toAsyncValidator(validatorOrOptions.asyncValidators)
@@ -511,6 +513,7 @@ export abstract class AbstractControl<T = any> {
 }
 
 export class FormControl<T = any> extends AbstractControl<T> {
+  readonly controls!: ComputedRef<undefined>
   constructor(
     private _initValue?: T,
     validatorOrOptions?: ValidatorFn | ValidatorFn[] | ValidatorOptions,
diff --git a/packages/cdk/forms/src/messages/en-US.ts b/packages/cdk/forms/src/messages/en-US.ts
new file mode 100644
index 000000000..6a571d101
--- /dev/null
+++ b/packages/cdk/forms/src/messages/en-US.ts
@@ -0,0 +1,53 @@
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
+ */
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+
+import type { AbstractControl } from '../controls'
+import type { ValidateError } from '../types'
+
+const defaultName = 'The input'
+
+export const enUSMessages = {
+  default: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name
+    return name ? `Validation error on field ${name}` : 'Validation error'
+  },
+  required: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} is required`
+  },
+  requiredTrue: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} is must be 'true'`
+  },
+  email: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} is not a valid email`
+  },
+  min: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} cannot be less than ${err.min}`
+  },
+  max: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name
+    return `${name} cannot be greater than ${err.max}`
+  },
+  minLength: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} cannot be less than ${err.minLength} in length, current is ${err.actual}`
+  },
+  maxLength: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} cannot be greater than ${err.minLength} in length, current is ${err.actual}`
+  },
+  pattern: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name} does not match pattern '${err.pattern}'`
+  },
+}
diff --git a/packages/cdk/forms/src/messages/zh-CN.ts b/packages/cdk/forms/src/messages/zh-CN.ts
new file mode 100644
index 000000000..d9c38c555
--- /dev/null
+++ b/packages/cdk/forms/src/messages/zh-CN.ts
@@ -0,0 +1,53 @@
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
+ */
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+
+import type { AbstractControl } from '../controls'
+import type { ValidateError } from '../types'
+
+const defaultName = '此项'
+
+export const zhCNMessages = {
+  default: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name
+    return `${name || ''}验证失败`
+  },
+  required: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}必填`
+  },
+  requiredTrue: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}必须为 'true'`
+  },
+  email: (_: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}不是一个有效的邮箱地址`
+  },
+  min: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}不能小于 ${err.min}`
+  },
+  max: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}不能大于 ${err.max}`
+  },
+  minLength: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}的长度不能小于 ${err.minLength}, 当前长度为 ${err.actual}`
+  },
+  maxLength: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}的长度不能小于 ${err.maxLength}, 当前长度为 ${err.actual}`
+  },
+  pattern: (err: Omit<ValidateError, 'message'>, control: AbstractControl): string => {
+    const name = control.name || defaultName
+    return `${name}不能匹配 '${err.pattern}'`
+  },
+}
diff --git a/packages/cdk/forms/src/types.ts b/packages/cdk/forms/src/types.ts
index e2b601a38..433be1125 100644
--- a/packages/cdk/forms/src/types.ts
+++ b/packages/cdk/forms/src/types.ts
@@ -22,7 +22,7 @@ export interface ValidateError {
 
 export type ValidateErrors = Record<string, ValidateError>
 
-export type ValidateMessageFn = (err: Omit<ValidateError, 'message'>) => string
+export type ValidateMessageFn = (err: Omit<ValidateError, 'message'>, control: AbstractControl) => string
 export type ValidateMessage = string | ValidateMessageFn | Record<string, string | ValidateMessageFn>
 export type ValidateMessages = Record<string, ValidateMessage>
 
@@ -38,6 +38,7 @@ export type TriggerType = 'change' | 'blur' | 'submit'
 
 export interface ValidatorOptions {
   disabled?: boolean
+  name?: string
   trigger?: TriggerType
   validators?: ValidatorFn | ValidatorFn[]
   asyncValidators?: AsyncValidatorFn | AsyncValidatorFn[]
diff --git a/packages/cdk/forms/src/validators.ts b/packages/cdk/forms/src/validators.ts
index 07d35e04f..383592879 100644
--- a/packages/cdk/forms/src/validators.ts
+++ b/packages/cdk/forms/src/validators.ts
@@ -22,82 +22,88 @@ import { isArray, isFunction, isNil, isNumber, isString } from 'lodash-es'
 
 import { isNumeric } from '@idux/cdk/utils'
 
+import { zhCNMessages } from './messages/zh-CN'
+
 /** See [this commit](https://github.com/angular/angular.js/commit/f3f5cf72e) for more details. */
 const emailRegexp =
   /^(?=.{1,254}$)(?=.{1,64}@)[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
 
 export class Validators {
-  private static messages: ValidateMessages = {}
+  private static messages: ValidateMessages = zhCNMessages
 
   static setMessages(messages: ValidateMessages): void {
     Validators.messages = { ...Validators.messages, ...messages }
   }
 
-  static getError(key: string, errorContext: Omit<ValidateError, 'message'> = {}): ValidateError {
+  static getError(
+    key: string,
+    control: AbstractControl,
+    errorContext: Omit<ValidateError, 'message'> = {},
+  ): ValidateError {
     let message: string | ValidateMessageFn | Record<string, string | ValidateMessageFn> | undefined = undefined
     const validMessage = Validators.messages[key] || Validators.messages.default || undefined
     if (isFunction(validMessage)) {
-      message = validMessage(errorContext)
+      message = validMessage(errorContext, control)
     } else {
       message = validMessage
     }
     return { ...errorContext, message }
   }
 
-  static required(value: any, _: AbstractControl): { required: ValidateError } | undefined {
+  static required(value: any, control: AbstractControl): { required: ValidateError } | undefined {
     if (isEmpty(value)) {
-      return { required: Validators.getError('required') }
+      return { required: Validators.getError('required', control) }
     }
     return undefined
   }
 
-  static requiredTrue(value: any, _: AbstractControl): { requiredTrue: ValidateError } | undefined {
+  static requiredTrue(value: any, control: AbstractControl): { requiredTrue: ValidateError } | undefined {
     if (value === true) {
       return undefined
     }
-    return { requiredTrue: Validators.getError('requiredTrue', { actual: value }) }
+    return { requiredTrue: Validators.getError('requiredTrue', control, { actual: value }) }
   }
 
-  static email(value: any, _: AbstractControl): { email: ValidateError } | undefined {
+  static email(value: any, control: AbstractControl): { email: ValidateError } | undefined {
     if (isEmpty(value) || emailRegexp.test(value)) {
       return undefined
     }
-    return { email: Validators.getError('email', { actual: value }) }
+    return { email: Validators.getError('email', control, { actual: value }) }
   }
 
   static min(min: number): ValidatorFn {
-    return (value: any, _: AbstractControl): { min: ValidateError } | undefined => {
+    return (value: any, control: AbstractControl): { min: ValidateError } | undefined => {
       if (isEmpty(value) || !isNumeric(value) || Number(value) >= min) {
         return undefined
       }
-      return { min: Validators.getError('min', { min, actual: value }) }
+      return { min: Validators.getError('min', control, { min, actual: value }) }
     }
   }
 
   static max(max: number): ValidatorFn {
-    return (value: any, _: AbstractControl): { max: ValidateError } | undefined => {
+    return (value: any, control: AbstractControl): { max: ValidateError } | undefined => {
       if (isEmpty(value) || !isNumeric(value) || Number(value) <= max) {
         return undefined
       }
-      return { max: Validators.getError('max', { max, actual: value }) }
+      return { max: Validators.getError('max', control, { max, actual: value }) }
     }
   }
 
   static minLength(minLength: number): ValidatorFn {
-    return (value: any, _: AbstractControl): { minLength: ValidateError } | undefined => {
+    return (value: any, control: AbstractControl): { minLength: ValidateError } | undefined => {
       if (isEmpty(value) || !hasLength(value) || value.length >= minLength) {
         return undefined
       }
-      return { minLength: Validators.getError('minLength', { minLength, actual: value.length }) }
+      return { minLength: Validators.getError('minLength', control, { minLength, actual: value.length }) }
     }
   }
 
   static maxLength(maxLength: number): ValidatorFn {
-    return (value: any, _: AbstractControl): { maxLength: ValidateError } | undefined => {
+    return (value: any, control: AbstractControl): { maxLength: ValidateError } | undefined => {
       if (isEmpty(value) || !hasLength(value) || value.length <= maxLength) {
         return undefined
       }
-      return { maxLength: Validators.getError('maxLength', { maxLength, actual: value.length }) }
+      return { maxLength: Validators.getError('maxLength', control, { maxLength, actual: value.length }) }
     }
   }
 
@@ -121,15 +127,15 @@ export class Validators {
       regexStr = pattern.toString()
       regex = pattern
     }
-    return (value: any, _: AbstractControl): { pattern: ValidateError } | undefined => {
+    return (value: any, control: AbstractControl): { pattern: ValidateError } | undefined => {
       if (isEmpty(value) || regex.test(value)) {
         return undefined
       }
-      return { pattern: Validators.getError('pattern', { pattern: regexStr, actual: value }) }
+      return { pattern: Validators.getError('pattern', control, { pattern: regexStr, actual: value }) }
     }
   }
 
-  static nullValidator(_: any, __: AbstractControl): undefined {
+  static nullValidator(_: any, _control: AbstractControl): undefined {
     return undefined
   }
 
@@ -172,7 +178,7 @@ function hasLength(val: any): boolean {
   return !isNil(val) && isNumber(val.length)
 }
 
-type GenericValidatorFn = (value: any, _: AbstractControl) => any
+type GenericValidatorFn = (value: any, control: AbstractControl) => any
 
 function executeValidators<V extends GenericValidatorFn>(
   value: any,
diff --git a/packages/components/form/demo/CustomizedValidation.md b/packages/components/form/demo/CustomizedValidation.md
index fb4230e24..41e524994 100644
--- a/packages/components/form/demo/CustomizedValidation.md
+++ b/packages/components/form/demo/CustomizedValidation.md
@@ -1,7 +1,7 @@
 ---
 title:
-  zh: 自定义验证
-  en: Customized validation
+  zh: 手动设置验证信息
+  en: Customized validation status and message
 order: 7
 ---
 
diff --git a/packages/components/form/demo/Message.md b/packages/components/form/demo/Message.md
index 2020cdfb2..d8d74501f 100644
--- a/packages/components/form/demo/Message.md
+++ b/packages/components/form/demo/Message.md
@@ -9,10 +9,14 @@ order: 6
 
 通过 `Validators.setMessages` 来设置默认的错误提示，可以减少 `template` 中的重复代码。
 
+默认的提示信息为 `zhCNMessages`，参见 [messages](https://github.com/IDuxFE/idux/tree/main/packages/cdk/forms/src/messages)
+
 注意：只需要全局设置一次，通常在 `main.ts` 中设置它。
 
 ## en
 
 By `Validators.setMessages` to set the default error message, you can reduce the repetitive code in the `template`.
 
+The default messages are `zhCNMessages`, refer to [messages](https://github.com/IDuxFE/idux/tree/main/packages/cdk/forms/src/messages)
+
 Note: You only need to set it globally once, usually in `main.ts`.
diff --git a/packages/components/form/demo/Message.vue b/packages/components/form/demo/Message.vue
index f39cbbd60..73d391810 100644
--- a/packages/components/form/demo/Message.vue
+++ b/packages/components/form/demo/Message.vue
@@ -47,20 +47,13 @@
 <script lang="ts">
 import { defineComponent } from 'vue'
 
-import { AbstractControl, ValidateErrors, Validators, useFormGroup } from '@idux/cdk/forms'
+import { AbstractControl, ValidateErrors, Validators, enUSMessages, useFormGroup, zhCNMessages } from '@idux/cdk/forms'
 
 Validators.setMessages({
-  default: '验证失败/Validation error',
   required: '必填项/Input is required',
-  email: { 'zh-CN': '邮箱格式不正确', 'en-US': 'The input is not valid email' },
-  minLength: {
-    'zh-CN': err => `长度不能小于 ${err.minLength}, 当前 ${err.actual}`,
-    'en-US': err => `Length can't be less than ${err.minLength}, current is ${err.actual}`,
-  },
-  maxLength: {
-    'zh-CN': err => `长度不能大于 ${err.maxLength}, 当前 ${err.actual}`,
-    'en-US': err => `Length can't be greater than ${err.maxLength}, current is ${err.actual}`,
-  },
+  email: { 'zh-CN': zhCNMessages.email, 'en-US': enUSMessages.email },
+  minLength: { 'zh-CN': zhCNMessages.minLength, 'en-US': enUSMessages.minLength },
+  maxLength: { 'zh-CN': zhCNMessages.maxLength, 'en-US': enUSMessages.maxLength },
   passwordRequired: {
     'zh-CN': '请确认你的密码',
     'en-US': 'Please confirm your password',
@@ -77,18 +70,18 @@ Validators.setMessages({
 
 const confirmPasswordValidator = (value: string, control: AbstractControl): ValidateErrors | undefined => {
   if (!value) {
-    return { passwordRequired: Validators.getError('passwordRequired') }
+    return { passwordRequired: Validators.getError('passwordRequired', control) }
   } else if (value !== control.root.get('password')?.getValue()) {
-    return { passwordConfirm: Validators.getError('passwordConfirm') }
+    return { passwordConfirm: Validators.getError('passwordConfirm', control) }
   }
   return undefined
 }
 
-const mobilePhoneValidator = (value: string): ValidateErrors | undefined => {
+const mobilePhoneValidator = (value: string, control: AbstractControl): ValidateErrors | undefined => {
   if (!value || /(^1\d{10}$)/.test(value)) {
     return undefined
   }
-  return { mobilePhone: Validators.getError('mobilePhone') }
+  return { mobilePhone: Validators.getError('mobilePhone', control) }
 }
 
 export default defineComponent({
@@ -100,7 +93,7 @@ export default defineComponent({
     const { required, email, minLength, maxLength } = Validators
 
     const formGroup = useFormGroup({
-      email: ['', [required, email]],
+      email: ['', { name: 'E-mail', validators: [required, email] }],
       password: ['', [required, minLength(12), maxLength(16)]],
       confirmPassword: ['', [required, confirmPasswordValidator]],
       nickname: ['', [required]],
diff --git a/packages/components/form/src/FormItem.tsx b/packages/components/form/src/FormItem.tsx
index a9b6edff3..3a91a289d 100644
--- a/packages/components/form/src/FormItem.tsx
+++ b/packages/components/form/src/FormItem.tsx
@@ -238,12 +238,16 @@ function useMessage(
     if (currMessage) {
       return isString(currMessage) ? currMessage : currMessage(control.value!)
     }
-
-    return getMessageByError(control.value?.errors.value, locale)
+    const currControl = control.value
+    return getMessageByError(currControl, currControl?.errors.value, locale)
   })
 }
 
-function getMessageByError(error: ValidateErrors | undefined, locale: ComputedRef<Locale>) {
+function getMessageByError(
+  control: AbstractControl | undefined,
+  error: ValidateErrors | undefined,
+  locale: ComputedRef<Locale>,
+) {
   if (!error) {
     return undefined
   }
@@ -256,14 +260,14 @@ function getMessageByError(error: ValidateErrors | undefined, locale: ComputedRe
       }
 
       if (isFunction(message)) {
-        return message(rest)
+        return message(rest, control!)
       }
 
       const currMessage = message[locale.value.type]
       if (isString(currMessage)) {
         return currMessage
       }
-      return currMessage(rest)
+      return currMessage(rest, control!)
     }
   }
 
diff --git a/packages/components/space/src/types.ts b/packages/components/space/src/types.ts
index 5a2234fd8..d17c6b4e6 100644
--- a/packages/components/space/src/types.ts
+++ b/packages/components/space/src/types.ts
@@ -6,7 +6,6 @@
  */
 
 import type { IxInnerPropTypes, IxPublicPropTypes } from '@idux/cdk/utils'
-import type { FormSize } from '@idux/components/form'
 import type { DefineComponent, HTMLAttributes } from 'vue'
 
 import { IxPropTypes } from '@idux/cdk/utils'
@@ -19,12 +18,7 @@ export const spaceProps = {
   align: IxPropTypes.oneOf<SpaceAlign>(['start', 'center', 'end', 'baseline']),
   block: IxPropTypes.bool,
   direction: IxPropTypes.oneOf<SpaceDirection>(['vertical', 'horizontal']).def('horizontal'),
-  size: IxPropTypes.oneOfType([
-    Number,
-    String,
-    IxPropTypes.oneOf([Number, String]),
-    IxPropTypes.oneOf<FormSize>(['sm', 'md', 'lg']),
-  ]),
+  size: IxPropTypes.oneOfType([Number, String, IxPropTypes.array<string | number>()]),
   split: IxPropTypes.oneOfType([String, IxPropTypes.vNode]),
   wrap: IxPropTypes.bool,
 }
diff --git a/packages/components/time-picker/src/types.ts b/packages/components/time-picker/src/types.ts
index 2fa90d164..3d135357c 100644
--- a/packages/components/time-picker/src/types.ts
+++ b/packages/components/time-picker/src/types.ts
@@ -59,7 +59,9 @@ export const timePickerProps = {
 
 export type TimePickerProps = IxInnerPropTypes<typeof timePickerProps>
 export type TimePickerPublicProps = IxPublicPropTypes<typeof timePickerProps>
-export type TimePickerComponent = DefineComponent<HTMLAttributes & typeof timePickerProps>
+export type TimePickerComponent = DefineComponent<
+  Omit<HTMLAttributes, keyof TimePickerPublicProps> & TimePickerPublicProps
+>
 export type TimePickerInstance = InstanceType<DefineComponent<TimePickerProps>>
 
 export const timeRangePickerProps = {
@@ -81,7 +83,9 @@ export const timeRangePickerProps = {
 
 export type TimeRangePickerProps = IxInnerPropTypes<typeof timeRangePickerProps>
 export type TimeRangePickerPublicProps = IxPublicPropTypes<typeof timeRangePickerProps>
-export type TimeRangePickerComponent = DefineComponent<HTMLAttributes & typeof timeRangePickerProps>
+export type TimeRangePickerComponent = DefineComponent<
+  Omit<HTMLAttributes, keyof TimeRangePickerPublicProps> & TimeRangePickerPublicProps
+>
 export type TimeRangePickerInstance = InstanceType<DefineComponent<TimeRangePickerProps>>
 
 export const baseTriggerProps = {