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
-
Component to display a tabbar on either the top or the bottom of a page. To define the tabs and the content the property renderTabs need to be implemented, that returns an array of tabs and their content. See the example for specifics.
Click here to see the original article
-
Docs are incorrect.
index should be "The index of the first tab to show"
renderTabs should be “Function that returns an array of objects with the keys content and tab”
-
@ephraimt This file would be the one to edit and create a PR.
https://github.com/OnsenUI/OnsenUI/blob/master/bindings/react/docs/Tabbar.json
I was off to do it, but I am not certain of the renderTabs function and maybe @Fran-Diox can chime in to confirm that is the proper definition. If so, I can generate the PR.
-
@ephraimt Thanks, that’s correct!
@munsterlander That is actually a generated file. This info is written as comments in the Tabbar.jsx source file. Thanks!
-
@ephraimt @munsterlander I am not sure that this demo actually works the way it is described. The initial active tab is being set correctly through index. However, if you setState in the prechange to always be index 0 you can still swap between the tabs.
In my application I can get the tabbar to be a “controlled” component, it always selects the tab you click. This looks like it is happening on the internal onClick method of ons-tabbar that is overriding the setActiveTab method in the React component.
