{"action":"closed","issue":{"url":"https://api.github.com/repos/GeekyAnts/NativeBase/issues/1798","repository_url":"https://api.github.com/repos/GeekyAnts/NativeBase","labels_url":"https://api.github.com/repos/GeekyAnts/NativeBase/issues/1798/labels{/name}","comments_url":"https://api.github.com/repos/GeekyAnts/NativeBase/issues/1798/comments","events_url":"https://api.github.com/repos/GeekyAnts/NativeBase/issues/1798/events","html_url":"https://github.com/GeekyAnts/NativeBase/issues/1798","id":315297387,"number":1798,"title":"Component LifeCycle method only being triggered for first time?","user":{"login":"isaaclem","id":32945572,"avatar_url":"https://avatars0.githubusercontent.com/u/32945572?v=4","gravatar_id":"","url":"https://api.github.com/users/isaaclem","html_url":"https://github.com/isaaclem","followers_url":"https://api.github.com/users/isaaclem/followers","following_url":"https://api.github.com/users/isaaclem/following{/other_user}","gists_url":"https://api.github.com/users/isaaclem/gists{/gist_id}","starred_url":"https://api.github.com/users/isaaclem/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/isaaclem/subscriptions","organizations_url":"https://api.github.com/users/isaaclem/orgs","repos_url":"https://api.github.com/users/isaaclem/repos","events_url":"https://api.github.com/users/isaaclem/events{/privacy}","received_events_url":"https://api.github.com/users/isaaclem/received_events","type":"User","site_admin":false},"labels":[{"id":508146406,"url":"https://api.github.com/repos/GeekyAnts/NativeBase/labels/can't%20reproduce","name":"can't reproduce","color":"c2e0c6","default":false}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":5,"created_at":"2018-04-18T01:33:16Z","updated_at":"2018-04-27T09:04:45Z","closed_at":"2018-04-27T09:04:45Z","author_association":"NONE","body":"## Issues\r\nUnder `Tabs` component, I've bind only one specific component and distinguish them based on props. While tab active, this component are expect to re-render or sorts to get the relevant values. However, it seems that component lifecycle method only being executed first time for each and every tab. Meaning if we revisit the tab once again, none of component lifecycle method will being invoke. \r\n\r\n## react-native, react and native-base version\r\n    \"native-base\": \"^2.4.2\",\r\n    \"react\": \"16.0.0\",\r\n    \"react-native\": \"0.52.0\",\r\n\r\n## Expected behaviour\r\nComponent lifecycle method will be invoked everytime a tab changed.\r\n\r\n## Actual behaviour\r\nComponent lifecycle method only being invoked for first time each tab active. Component Lifecycle method will not be invoked again if the tab is revisit.\r\n\r\n## Steps to reproduce (code snippet or screenshot)\r\n\r\n    <Tabs \r\n      initialPage={this.props.day}\r\n      tabBarUnderlineStyle={{ backgroundColor: '#5AF158' }} \r\n      renderTabBar={() => <ScrollableTab />}>\r\n      {this.renderTabHeader()}\r\n    </Tabs>\r\n\r\n    renderTabHeader() {\r\n      return (\r\n        this.props.dateArray.map((date, i) => \r\n          <Tab \r\n            key={i}\r\n            heading={date.format('DD/MM')} \r\n            tabStyle={styles.tabStyling} \r\n            activeTabStyle={styles.activeTabStyle} \r\n            textStyle={styles.tabTextStyle} \r\n            activeTextStyle={styles.activeTabTextStyle} \r\n          >\r\n            <View style={{ backgroundColor: '#EEEEEE', flex: 1 }}>\r\n              <Content contentDate={date.format('YYYY-MM-DD')} />\r\n            </View>\r\n          </Tab>\r\n        )\r\n      );\r\n    }\r\n\r\nContent Component:\r\n\r\n    class Content extends Component {\r\n      componentWillMount() {\r\n        console.log('Component Will Mount() ?');\r\n        this.props.loadTransactionByDate({ date: this.props.contentDate });\r\n      }\r\n\r\n    componentWillUpdate(nextProps, nextState) {\r\n      console.log('Component Will Update() ?');\r\n    }\r\n\r\n    render() {\r\n      return (\r\n        <View><Text>{this.props.contentDate}</Text></View>\r\n      );\r\n      }\r\n"}}
{"actor":{"display_login":"akhil-geekyants"}}