I have a project which has dynamic tabs like Google Chrome. When you click a page on the side menu, then it opens in another tab. Anyway, when I switch between tabs and back to the previous tab I see all values in inputs are cleared. I want to prevent re-render after I open the tab one time unless I click the buttons. If I get/add some values in a page and switch between tabs. Then I want to see all these values again when I go back to the first page. I'm using react-awesome-tabs library.

My Tabs code;

<Tabs
      active={this.state.activeTab}
      onTabSwitch={this.handleTabSwitch.bind(this)}
      //onTabPositionChange={ this.handleTabPositionChange.bind(this) }
      onTabClose={this.handleTabClose.bind(this)}
      onTabAdd={this.handleTabAdd.bind(this)}
      draggable={true}
      showAdd={true}
    >
      {
        this.tabs.map((value, index) => {
          return (
            <Tab
              key={index}
              title={value.title}
              showClose={true}

            >
              {this.state.activePageisNull ? this.state.initialPage : this.state.activePage}
            </Tab>
          );
        })
      }
    </Tabs>

And my screen page;