fix(NavBar): Component renders blank left/right. (#7376)

This commit is contained in:
Callum 2020-10-22 05:56:17 +02:00 committed by GitHub
parent dab89fe86e
commit 3664659240
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 8 deletions

View File

@ -67,19 +67,27 @@ export default createComponent({
style={{ zIndex: this.zIndex }}
class={[bem({ fixed: this.fixed }), { [BORDER_BOTTOM]: this.border }]}
>
<div class={bem('left')} onClick={this.onClickLeft}>
{this.hasLeft() && <div class={bem('left')} onClick={this.onClickLeft}>
{this.genLeft()}
</div>
</div>}
<div class={[bem('title'), 'van-ellipsis']}>
{this.slots('title') || this.title}
</div>
<div class={bem('right')} onClick={this.onClickRight}>
{this.hasRight() && <div class={bem('right')} onClick={this.onClickRight}>
{this.genRight()}
</div>
</div>}
</div>
);
},
hasLeft() {
return this.leftArrow || this.leftText || this.slots('left');
},
hasRight() {
return this.rightText || this.slots('right');
},
onClickLeft(event) {
this.$emit('click-left', event);
},

View File

@ -3,9 +3,7 @@
exports[`placeholder prop 1`] = `
<div class="van-nav-bar__placeholder" style="height: 50px;">
<div class="van-nav-bar van-nav-bar--fixed van-hairline--bottom">
<div class="van-nav-bar__left"></div>
<div class="van-nav-bar__title van-ellipsis"></div>
<div class="van-nav-bar__right"></div>
</div>
</div>
`;
@ -20,8 +18,6 @@ exports[`render left & right slot 1`] = `
exports[`render title slot 1`] = `
<div class="van-nav-bar van-hairline--bottom">
<div class="van-nav-bar__left"></div>
<div class="van-nav-bar__title van-ellipsis">Custom Title</div>
<div class="van-nav-bar__right"></div>
</div>
`;