React Navigation引數傳遞動態修改navigationOptions->title
阿新 • • 發佈:2019-02-06
前言
博主最近在寫react native,發現Navigator只剩下NavigatorIOS可以使用,要想在安卓上使用Navigator,可以使用官方推薦的React-Nativation。因為對ES的語法不熟,加上需要看文件慢慢鼓搗,所以總有些坑得慢慢躺。下面講的這個問題是動態修改Navigator的title。
問題描述
navigation跳轉的時候,傳遞引數後,需要跳轉後的頁面接收,並且修改navigationOptions中的title,使得動態修改跳轉頁面的標題
解決辦法
1. 傳參
onPress={() => { this.props.navigation.navigate('需要跳轉的Screen', { title: '需要傳遞的引數' }); }}
具體傳參的例項程式碼可以去參照官方文件:https://reactnavigation.org/docs/params.html
注意: 如果當前js定義和使用了Navigator,則這個元件會自動繫結在this.props.navigation中,所以你可以在全域性使用它提供的方法,或者將this.props.navigation在使用其他頁面的元件模組時傳遞到相應的js中。
2. 接收引數
class list extends Component{ static navigationOptions = ({ navigation }) =>({ title: navigation.state.params.title, }); render() {...} }
注意這個語法,因為對ES的語法不熟,所以開始時候搞不明白可以使用什麼來給navigationOptions傳參,後來發現可以這樣,({navigation})是呼叫當前方法時自動注入的引數, 然後新增下面那行就可以實現動態修改title的功能了。