Tabbar

[BoxSoft]

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?