blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

fix(Toast): icon-size prop should affect loading icon (#8339)

Browse Source
This commit is contained in:
neverland 2021-03-14 11:52:28 +08:00 committed by GitHub
parent 7a14991b16
commit ca9ec7e1bd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/toast/README.zh-CN.md
View File

@ -166,7 +166,7 @@ Toast.resetDefaultOptions('loading');
| position | 位置，可选值为 `top` `bottom` | _string_ | `middle` | | position | 位置，可选值为 `top` `bottom` | _string_ | `middle` |
| message | 文本内容，支持通过`\n`换行 | _string_ | `''` | - | | message | 文本内容，支持通过`\n`换行 | _string_ | `''` | - |
| icon | 自定义图标，支持传入[图标名称](#/zh-CN/icon)或图片链接 | _string_ | - | | icon | 自定义图标，支持传入[图标名称](#/zh-CN/icon)或图片链接 | _string_ | - |
| iconSize | 自定义图标大小，如 `20px` `2em`，默认单位为 `px` | _number \| string_ | `36px` | | iconSize | 图标大小，如 `20px` `2em`，默认单位为 `px` | _number \| string_ | `36px` |
| iconPrefix | 图标类名前缀，同 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | _string_ | `van-icon` | | iconPrefix | 图标类名前缀，同 Icon 组件的 [class-prefix 属性](#/zh-CN/icon#props) | _string_ | `van-icon` |
| overlay | 是否显示背景遮罩层 | _boolean_ | `false` | | overlay | 是否显示背景遮罩层 | _boolean_ | `false` |
| forbidClick | 是否禁止背景点击 | _boolean_ | `false` | | forbidClick | 是否禁止背景点击 | _boolean_ | `false` |

8
src/toast/Toast.tsx
View File

@ -83,14 +83,14 @@ export default defineComponent({
}; };
const renderIcon = () => { const renderIcon = () => {
const { icon, type, iconPrefix, loadingType } = props; const { icon, type, iconSize, iconPrefix, loadingType } = props;
const hasIcon = icon || type === 'success' || type === 'fail'; const hasIcon = icon || type === 'success' || type === 'fail';
if (hasIcon) { if (hasIcon) {
return ( return (
<Icon <Icon
name={icon || type} name={icon || type}
size={props.iconSize} size={iconSize}
class={bem('icon')} class={bem('icon')}
classPrefix={iconPrefix} classPrefix={iconPrefix}
/> />
@ -98,7 +98,9 @@ export default defineComponent({
} }
if (type === 'loading') { if (type === 'loading') {
return <Loading class={bem('loading')} type={loadingType} />; return (
<Loading class={bem('loading')} size={iconSize} type={loadingType} />
);
} }
}; };

14
src/toast/test/index.spec.ts
View File

@ -74,3 +74,17 @@ test('should change icon size when using icon-size prop', async () => {
await later(); await later();
expect(wrapper.find('.van-icon').style.fontSize).toEqual('10px'); expect(wrapper.find('.van-icon').style.fontSize).toEqual('10px');
}); });
test('should change loading icon size when using icon-size prop', async () => {
const wrapper = mount(Toast, {
props: {
show: true,
type: 'loading',
iconSize: '10',
},
});
await later();
expect(wrapper.find('.van-loading__spinner').style.width).toEqual('10px');
expect(wrapper.find('.van-loading__spinner').style.height).toEqual('10px');
});