diff --git a/packages/vant/src/field/Field.tsx b/packages/vant/src/field/Field.tsx
index 6b98fbec1..d1b3acf5d 100644
--- a/packages/vant/src/field/Field.tsx
+++ b/packages/vant/src/field/Field.tsx
@@ -469,9 +469,12 @@ export default defineComponent({
const message = props.errorMessage || state.validateMessage;
if (message) {
+ const slot = slots['error-message'];
const errorMessageAlign = getProp('errorMessageAlign');
return (
-
{message}
+
+ {slot ? slot({ message }) : message}
+
);
}
};
diff --git a/packages/vant/src/field/README.md b/packages/vant/src/field/README.md
index a042f7ccb..b7cc4216a 100644
--- a/packages/vant/src/field/README.md
+++ b/packages/vant/src/field/README.md
@@ -339,14 +339,15 @@ fieldRef.value?.focus();
### Slots
-| Name | Description |
-| ---------- | --------------------------- |
-| label | Custom label |
-| input | Custom input |
-| left-icon | Custom left icon |
-| right-icon | Custom right icon |
-| button | Insert button |
-| extra | Custom content on the right |
+| Name | Description | SlotProps |
+| ---------------------- | --------------------------- | --------------------- |
+| label | Custom label | - |
+| input | Custom input | - |
+| left-icon | Custom left icon | - |
+| right-icon | Custom right icon | - |
+| button | Insert button | - |
+| error-message `v3.2.5` | Custom error message | _{ message: string }_ |
+| extra | Custom content on the right | - |
## Theming
diff --git a/packages/vant/src/field/README.zh-CN.md b/packages/vant/src/field/README.zh-CN.md
index b1d842813..e0c303b4c 100644
--- a/packages/vant/src/field/README.zh-CN.md
+++ b/packages/vant/src/field/README.zh-CN.md
@@ -358,14 +358,15 @@ fieldRef.value?.focus();
### Slots
-| 名称 | 说明 |
-| --- | --- |
-| label | 自定义输入框左侧文本 |
-| input | 自定义输入框,使用此插槽后,与输入框相关的属性和事件将失效。
在 Form 组件进行表单校验时,会使用 input 插槽中子组件的 `value`,而不是 Field 组件的 `value`。 |
-| left-icon | 自定义输入框头部图标 |
-| right-icon | 自定义输入框尾部图标 |
-| button | 自定义输入框尾部按钮 |
-| extra | 自定义输入框最右侧的额外内容 |
+| 名称 | 说明 | 参数 |
+| --- | --- | --- |
+| label | 自定义输入框左侧文本 | - |
+| input | 自定义输入框,使用此插槽后,与输入框相关的属性和事件将失效 | - |
+| left-icon | 自定义输入框头部图标 | - |
+| right-icon | 自定义输入框尾部图标 | - |
+| button | 自定义输入框尾部按钮 | - |
+| error-message `v3.2.5` | 自定义底部错误提示文案 | _{ message: string }_ |
+| extra | 自定义输入框最右侧的额外内容 | - |
## 主题定制
diff --git a/packages/vant/src/field/test/__snapshots__/index.spec.js.snap b/packages/vant/src/field/test/__snapshots__/index.spec.js.snap
index 3fc01ab39..43b62eb8f 100644
--- a/packages/vant/src/field/test/__snapshots__/index.spec.js.snap
+++ b/packages/vant/src/field/test/__snapshots__/index.spec.js.snap
@@ -13,6 +13,12 @@ exports[`should render colon when using colon prop 1`] = `
`;
+exports[`should render error-message slot correctly 1`] = `
+
+ Custom error
+
+`;
+
exports[`should render extra slot correctly 1`] = `
diff --git a/packages/vant/src/field/test/index.spec.js b/packages/vant/src/field/test/index.spec.js
index 7aae711c3..dd527cc83 100644
--- a/packages/vant/src/field/test/index.spec.js
+++ b/packages/vant/src/field/test/index.spec.js
@@ -467,3 +467,16 @@ test('should render id prop correctly', async () => {
expect(wrapper.find('input').attributes('id')).toEqual('my-id');
expect(wrapper.find('label').attributes('for')).toEqual('my-id');
});
+
+test('should render error-message slot correctly', async () => {
+ const wrapper = mount(Field, {
+ props: {
+ errorMessage: 'error',
+ },
+ slots: {
+ 'error-message': ({ message }) => `Custom ${message}`,
+ },
+ });
+
+ expect(wrapper.find('.van-field__error-message').html()).toMatchSnapshot();
+});