mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[new feauture] NoticeBar: add left-icon slot
This commit is contained in:
parent
e00f43e595
commit
152ee6a90d
@ -51,6 +51,10 @@
|
|||||||
|
|
||||||
- 新增`Skeleton`骨架屏组件
|
- 新增`Skeleton`骨架屏组件
|
||||||
|
|
||||||
|
## NoticeBar
|
||||||
|
|
||||||
|
- 新增`left-icon`插槽
|
||||||
|
|
||||||
### Sku
|
### Sku
|
||||||
|
|
||||||
- 新增`preview-open`事件
|
- 新增`preview-open`事件
|
||||||
|
@ -92,6 +92,10 @@ export default sfc({
|
|||||||
animationDuration: this.duration + 's'
|
animationDuration: this.duration + 's'
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const LeftIcon =
|
||||||
|
this.slots('left-icon') ||
|
||||||
|
(this.leftIcon && <Icon class={bem('left-icon')} name={this.leftIcon} />);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
vShow={this.showNoticeBar}
|
vShow={this.showNoticeBar}
|
||||||
@ -101,9 +105,7 @@ export default sfc({
|
|||||||
this.$emit('click');
|
this.$emit('click');
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{this.leftIcon && (
|
{LeftIcon}
|
||||||
<Icon class={bem('left-icon')} name={this.leftIcon} />
|
|
||||||
)}
|
|
||||||
<div ref="wrap" class={bem('wrap')}>
|
<div ref="wrap" class={bem('wrap')}>
|
||||||
<div
|
<div
|
||||||
ref="content"
|
ref="content"
|
||||||
@ -120,11 +122,7 @@ export default sfc({
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{iconName && (
|
{iconName && (
|
||||||
<Icon
|
<Icon class={bem('right-icon')} name={iconName} onClick={this.onClickIcon} />
|
||||||
class={bem('right-icon')}
|
|
||||||
name={iconName}
|
|
||||||
onClick={this.onClickIcon}
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
10
packages/notice-bar/test/__snapshots__/index.spec.js.snap
Normal file
10
packages/notice-bar/test/__snapshots__/index.spec.js.snap
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`left-icon slot 1`] = `
|
||||||
|
<div class="van-notice-bar">Custom Left Icon<div class="van-notice-bar__wrap">
|
||||||
|
<div class="van-notice-bar__content" style="padding-left: 0px; animation-delay: 1s; animation-duration: 0s;">
|
||||||
|
Content
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
@ -12,3 +12,19 @@ test('close event', () => {
|
|||||||
close.trigger('click');
|
close.trigger('click');
|
||||||
expect(wrapper.emitted('close')).toBeTruthy();
|
expect(wrapper.emitted('close')).toBeTruthy();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('left-icon slot', () => {
|
||||||
|
const wrapper = mount({
|
||||||
|
template: `
|
||||||
|
<notice-bar>
|
||||||
|
Content
|
||||||
|
<template v-slot:left-icon>Custom Left Icon</template>
|
||||||
|
</notice-bar>
|
||||||
|
`,
|
||||||
|
components: {
|
||||||
|
NoticeBar
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(wrapper).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
Loading…
x
Reference in New Issue
Block a user