feat(Image): add default slot (#6613)

This commit is contained in:
neverland 2020-06-26 17:36:10 +08:00 committed by GitHub
parent 1b15c6066e
commit 01e9cde2b8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 31 additions and 8 deletions

View File

@ -99,6 +99,7 @@ Vue.use(Lazyload);
### Slots ### Slots
| Name | Description | | Name | Description |
| ------- | -------------------------- | | ---------------- | ---------------------------------- |
| default `v2.9.0` | Custom the content below the image |
| loading | Custom loading placeholder | | loading | Custom loading placeholder |
| error | Custom error placeholder | | error | Custom error placeholder |

View File

@ -131,7 +131,8 @@ Vue.use(Lazyload);
### Slots ### Slots
| 名称 | 说明 | | 名称 | 说明 |
| ------- | -------------------------- | | ---------------- | -------------------------- |
| default `v2.9.0` | 自定义图片下方的内容 |
| loading | 自定义加载中的提示内容 | | loading | 自定义加载中的提示内容 |
| error | 自定义加载失败时的提示内容 | | error | 自定义加载失败时的提示内容 |

View File

@ -173,6 +173,7 @@ export default createComponent({
> >
{this.genImage()} {this.genImage()}
{this.genPlaceholder()} {this.genPlaceholder()}
{this.slots()}
</div> </div>
); );
}, },

View File

@ -1,5 +1,12 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`default slot 1`] = `
<div class="van-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon">
<!----></i></div>Custom Default
</div>
`;
exports[`error-icon prop 1`] = ` exports[`error-icon prop 1`] = `
<div class="van-image"> <div class="van-image">
<div class="van-image__error"><i class="van-icon van-icon-error van-image__error-icon"> <div class="van-image__error"><i class="van-icon van-icon-error van-image__error-icon">

View File

@ -157,3 +157,16 @@ test('radius prop', () => {
expect(wrapper).toMatchSnapshot(); expect(wrapper).toMatchSnapshot();
}); });
test('default slot', () => {
const wrapper = mount(VanImage, {
propsData: {
src: 'https://img.yzcdn.cn/vant/cat.jpeg',
},
scopedSlots: {
default: () => 'Custom Default',
},
});
expect(wrapper).toMatchSnapshot();
});