javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(): fix tabs (#19821)

Browse Source 
* fix(tabs): do not wait on child tab setActive() lazy loading

* whenDefined example

* chore(): fix lint
This commit is contained in:
Mike Hartington
2019-11-01 09:29:30 -07:00
committed by GitHub
parent 7bd4412889
commit 60aa027903
4 changed files with 22 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
core/src/components/tab/tab.tsx
View File

@ -1,4 +1,4 @@
import { Build, Component, ComponentInterface, Element, Host, Method, Prop, h } from '@stencil/core';
import { Build, Component, ComponentInterface, Element, Host, Method, Prop, Watch, h } from '@stencil/core';
import { ComponentRef, FrameworkDelegate } from '../../interface';
import { attachComponent } from '../../utils/framework-delegate';
@ -30,7 +30,7 @@ export class Tab implements ComponentInterface {
*/
@Prop() component?: ComponentRef;
componentWillLoad() {
async componentWillLoad() {
if (Build.isDev) {
if (this.component !== undefined && this.el.childElementCount > 0) {
console.error('You can not use a lazy-loaded component in a tab and inlined content at the same time.' +
@ -39,6 +39,9 @@ export class Tab implements ComponentInterface {
`- Remove the embedded content inside the ion-tab: <ion-tab></ion-tab>`);
}
}
if (this.active) {
await this.setActive();
}
}
/** Set the active component for the tab */
@ -48,6 +51,13 @@ export class Tab implements ComponentInterface {
this.active = true;
}
@Watch('active')
changeActive(isActive: boolean) {
if (isActive) {
this.prepareLazyLoaded();
}
}
private prepareLazyLoaded(): Promise<HTMLElement | undefined> {
if (!this.loaded && this.component != null) {
this.loaded = true;