2017-11-28 7 views
0

私はreact navigationを使用しています。私はonPressのヘッダーを隠し、別の機能を表示したい。私はそれを隠すことができますが、再び表示されません。私はヘッダーで1つだけの機能を行うことができるようです。私のコードは:リアクションナビゲーションヘッダーが隠れていない/表示されていません

ボタン上のヘッダーを表示して表示したいと思っています。私は間違って何をしていますか?

助けてください。

アップデート1:

_handleHide(){ 
     this.props.navigation.setParams({ 
      header: false 
     }) 
    } 

    _handleShow(){ 
     this.props.navigation.setParams({ 
      header : (HeaderProps) => <View style={{ height:20,backgroundColor:'blue' }} ></View> 
     }) 
    } 

    componentWillMount(){ 
     this.props.navigation.setParams({ 
      header : (HeaderProps) => <View style={{ height:20,backgroundColor:'blue' }} ></View> 
     }) 
    } 
+1

は、それはあなたがhandleHide()内のヘッダにnull値を渡しているのため、代わりにヌルの「false」に渡してください。 –

+0

ありがとうございます。それをしました。まだ動作しません。ヘッダーはボタンonPressイベントに反応しません。 – Somename

答えて

2

反応させ、ナビゲーション、

ヘッダ

要素又は所与HeaderPropsが反応 を返す関数と反応におけるドキュメントによれば、ヘッダーとして表示する要素。 nullに設定するとヘッダーが非表示になります。したがって、ちょうどuはカスタム要素または要素ではない「真」

header = <View style={{ height:20,backgroundColor:'blue' }} ></View> 

又は

を返す関数を提供しなければならないヘッダを示すために今

header = null; 

を使用ヘッダを隠すため

header = (HeaderProps) => <View style={{ height:20,backgroundColor:'blue' }} ></View> 

私はちょうど隠して見せたい代わりに、カスタム1を作成し、デフォルトのヘッダー、

ソース:https://github.com/react-community/react-navigation/issues/1444

//Import Header from 'react-navigation' and render it back with the headerProps u get 
import { Header } from 'react-navigation'; 
static navigationOptions =() => ({ 
    header: (headerProps) => <Header {... headerProps} />, 
}); 
+0

Ravi Raj ..それは働いた!ありがとう!あなたは男です!私はデフォルトヘッダーを使用しています。ヘッダーの下にTabNavigatorがあり、その上にonPressを表示/非表示にしたい場合はどうすればよいですか? https://stackoverflow.com/questions/47516155/hide-tabnavigators-and-header-on-scroll – Somename

関連する問題