Navigation

    Monaca & Onsen UI
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. mihail
    M
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    mihail

    @mihail

    0
    Reputation
    1
    Posts
    315
    Profile views
    1
    Followers
    0
    Following
    Joined Last Online

    mihail Follow

    Posts made by mihail

    • Mounting / unmounting react components on tab change

      Hi,

      Probably a dumb question but I really cannot sort it out, when the app is first loading, all the tab components get mounted, the componentDidMount is called.
      What I’am aiming is to only mount the active tab component and on tab change to unmount the current component and mount the next selected one.

      For example, by default the Home should be mounter but LastTen and Search to be left untouched, if I switch to LastTen then I want the Home to be unmounted and only LastTen mounted.

      Thanks!!!

      class Tabs extends React.Component {
        renderTabs() {
          return [
            {
              content: <Home key="home" navigator={this.props.navigator} />,
              tab: <Tab key="home" label="Home" icon="ion-ios-home-outline" />
            },
            {
              content: <LastTen key="last10" navigator={this.props.navigator} />,
              tab: <Tab key="last10" label="Last photos" icon="ion-ios-albums-outline" />
            },
            {
              content: <Search key="forms" navigator={this.props.navigator} />,
              tab: <Tab key="search" label="Search" icon="ion-search" />
            }
          ];
        }
      
        render() {
          return (
            <Page>
              <Tabbar
                renderTabs={this.renderTabs.bind(this)}
              />
            </Page>
          );
        }
      }
      
      posted in Onsen UI
      M
      mihail