3. Tabbar

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Tabbar

  • B

    I’m attempting to create a tabbar with 4 tabs. If I specify the content for all four, then it initially displays correctly, but then perhaps a half-second later it displays an error: TypeError: el._show is not a function. The location in code is:

    P:/core/src/elements/ons-tabbar/index.js:570

  567 |     const activeIndex = this.getActiveTabIndex(tabs);
  568 |     this._loadInactive.resolve();
  569 |     if (tabs.length > 0 && activeIndex >= 0) {
> 570 |       tabs[activeIndex].loaded.then(el => el && setImmediate(() => el._show()));
  571 | ^   }
  572 |   });
  573 | }

    Curiously, if I omit the content attribute for any one of the four tabs, then the error doesn’t occur. (If I remove it for the first tab, then the content becomes misaligned, but without the error message.)

    I’ve simplified my Tabbar to this, and I’m still getting the incorrect behavior:

        <Tabbar
        renderTabs={() => [
            {
                key: 'Home',
                tab: <Tab label="Dashboard" icon="ion-md-stats" />,
                content: <p>Dashboard</p>
            },
            {
                key: 'Items',
                tab: <Tab label="Items" icon="ion-md-pricetag" />,
                content: <p>ItemsMenu</p>
            },
            {
                key: 'Cart',
                tab: <Tab label="Cart" icon="ion-md-cart" />,
                content: <p>Cart</p>
            },
            {
                key: 'Settings',
                tab: <Tab label="Settings" icon="ion-md-settings" />,
                // content: <p>Settings</p> // Comment this to prevent error
            }
        ]}
    />

    Do you have any idea what’s going wrong here?

    0