Question

我的导航initializeRoute屏幕是main.js

main.js具有onAuthStateCHange来检测当前用户的更改

如果当前用户是loggend主要渲染组件“ ChatScreen” else main渲染一个组件“ LoginScreen”

问题是chatScreen和LoginScreen具有相同的导航标题栏（主标题栏）

我需要登录屏幕没有标题，而chatScreen有

我尝试使用a
在登录和聊天时为static navigationOptions = {header：null}，但是我们可以看到的de header是main.js的标题

如果我将main上的标头设置为null，则chatScreen也没有标头

 class App extends React.Component {

  constructor() {
    super();
    this.unsubscriber = null;
    this.state = {
      user: null,
    };
  }


  componentDidMount() {
    this.unsubscriber = firebase.auth().onAuthStateChanged((user) => {
      this.setState({ user });
    });
  }

  render() {
    if (!this.state.user) {
      return <Login />;
    }

    return <Chat />;

  }

}

Answer 1

main.js屏幕中的解决方案如下，将导航保持不变。

RIGHT(t.StationName, 2)

然后，在ChatScreen屏幕中，您可以个性化标题，而无需依赖于反应导航库，您可以以个性化的方式进行操作。

// main.js
static navigationOptions = ({ navigation }) => {
  return { title: "", header: null 
  };
};

子组件Chat必须具有导航属性

// Chat.js
class Chat extends Component {
render() {
return (
   <SafeAreaView>
    {/*header*/}
    <View style={{justifyContent: 'center', alignItems: 'center'}}>
    <Text>Chat</Text>
    </View>
    {/*body*/}
    <View>
    </View>
    </SafeAreaView>
    );
   }
} 
export default Chat;

然后应该通过聊天儿童。

<Chat navigation={this.props.navigation} />

如何更改同一组件中的标题导航？

1 个答案: