2017-03-14 1 views
0

TabBar에 여러 TabBar.Item 구성 요소가 있습니다. 각 TabBar.Item 구성 요소에는 고유 한 NavigatorIOS가 있습니다. 여기 React Native NavigatorIOS가 구성 요소를 다시 렌더링하지 않습니다.

는 사용자가 Filter 버튼을 클릭하면 내가 단순히 NavigatorIOS

<NavigatorIOS 
    ref="nav" 
    initialRoute={{ ...this.props }} 
    style={{ 
    flex: 1 
    }} 
/> 

을 렌더링, 내 NavigationBar.js 내에서 내 TabBar.js

<TabBarIOS> 
    <TabBarIOS.Item 
    selected={this.state.selectedTab === "profile"} 
    systemIcon={"most-viewed"} 
    onPress={() => this.setTab("profile")} 
    > 
    <NavigationBar title="Profile" component={Profile} passProps={{ showFilter: this.state.showFilter }} /> 
    </TabBarIOS.Item> 
</TabBarIOS> 

내 코드의 예, this.state.showFilterTabBar에 업데이트됩니다 . 그것은 NavigationBar의 내부 render() 기능이 initialRoute (프로필)에 나열된 구성 요소

을 다시 렌더링하지 않습니다 내 구성 요소입니다,이 시점에서

그러나 실행, 제대로 NavigatonBar에가 아래로 통과 그럼 이것을 달성하는 어떤 방법? 필터를 클릭 할 때 Profile 내부에 선택적 변수를 설정하여 필터를 숨기고 표시해야합니다. Modal

+0

IOS를 모르겠지만 가능한 해결책을 제시하는 것처럼 보입니다. http://stackoverflow.com/questions/3249240/how-to-pop-a-controller-off-the-navigation- stack-without-using-navigation-ba –

+0

댓글을 주셔서 감사합니다. 이것은 Swift/Objective-C (귀하가 제공 한 링크에있는 내용)에 따라 React Native (JavaScript)와 더 관련이 있습니다. – Dan

답변

0

더 세련된 해결책이 있는지는 잘 모르지만 작동하는 것은 확실합니다.

나는 NavigationBar의 내부에 다음 코드를 추가 :

shouldComponentUpdate(nextProps, nextState) { 
    this.refs.nav.replace({...nextProps}) 
    return true; 
    } 

이는 initialRoute 구성 요소의 다시로드를 강제 할 것이다.

관련 문제