diff --git a/packages/vant/src/toast/Toast.tsx b/packages/vant/src/toast/Toast.tsx index 89213854f..7277a0fd1 100644 --- a/packages/vant/src/toast/Toast.tsx +++ b/packages/vant/src/toast/Toast.tsx @@ -71,7 +71,7 @@ export default defineComponent({ emits: ['update:show'], - setup(props, { emit }) { + setup(props, { emit, slots }) { let timer: NodeJS.Timeout; let clickable = false; @@ -118,6 +118,10 @@ export default defineComponent({ const renderMessage = () => { const { type, message } = props; + if (slots.message) { + return
{slots.message()}
; + } + if (isDef(message) && message !== '') { return type === 'html' ? (
diff --git a/packages/vant/src/toast/test/__snapshots__/index.spec.ts.snap b/packages/vant/src/toast/test/__snapshots__/index.spec.ts.snap index 0b51365aa..3ab4703fc 100644 --- a/packages/vant/src/toast/test/__snapshots__/index.spec.ts.snap +++ b/packages/vant/src/toast/test/__snapshots__/index.spec.ts.snap @@ -12,3 +12,17 @@ exports[`create a forbidClick toast 1`] = `
`; + +exports[`should render message slot correctly 1`] = ` + + + +`; diff --git a/packages/vant/src/toast/test/index.spec.ts b/packages/vant/src/toast/test/index.spec.ts index 80e987422..950f58f2d 100644 --- a/packages/vant/src/toast/test/index.spec.ts +++ b/packages/vant/src/toast/test/index.spec.ts @@ -88,3 +88,17 @@ test('should change loading icon size when using icon-size prop', async () => { expect(wrapper.find('.van-loading__spinner').style.width).toEqual('10px'); expect(wrapper.find('.van-loading__spinner').style.height).toEqual('10px'); }); + +test('should render message slot correctly', async () => { + const wrapper = mount(Toast, { + props: { + show: true, + }, + slots: { + message: () => 'Custom Message', + }, + }); + + await later(); + expect(wrapper.html()).toMatchSnapshot(); +});