別のクラスReact NativeからnavigationOptionsを変更する方法

bugfix> android > 投稿 2020-08-25 16:00

クラスのヘッダータイトルを次のような別のクラスから変更したい：

これは、ボタンを使用して、最初のクラスのタイトルを変更したい2番目のクラスです。

export default class lingua extends React.Component { 
cambiolingua= () =>
{   
const registra = new Registra(); //in this class I want to change title
registra.ChangeTitle('New Title');
this.props.navigation.navigate('Registra')
}

そして、これは私がタイトルを変更する必要がある最初のクラスです：

export default class Registra extends React.Component {
static navigationOptions = ({ navigation }) => {
const {state} = navigation;
return {
  title: `${state.params.title}`,
};
};
 ChangeTitle = (titleText) => {
  const {setParams} = this.props.navigation;
  setParams({ title: titleText })
 }

しかし、「undefined is a object（ '_this.props.navigation'を評価する）ではない」というエラーを受け取ります

どうすれば解決できますか？

android

reactjs

react-native

回答 1 件

まず、エラーは小道具 navigation を持っていないという事実に起因していますあなたのクラスで lingua 。これは、 lingua という事実によって説明できます。は、 stackNavigator のシーンではありません（または反応ナビゲーションからのあらゆる種類のナビゲーター）。

2つの解決策があります。 1）ナビゲーションプロップをスタック内の画面からこのコンポーネントに渡します。 2）高次コンポーネント withNavigation を使用できます react-navigation の lingua に追加する

例：
```
import {withNavigation} from 'react-navigation'
class tmp extends React.Component {
  render() {
    const {navigation} = this.props; //with the withNavigation, you have access to the navigation even though it is not a screen
    return <View />
  }
}
export default withNavigation(tmp);
```
あなたがするようにnavigationOptionsを更新するよりもタイトルを変更するより良い方法は Registra にナビゲートすることです目的のタイトルを直接送信します。
```
// In lingua
this.props.navigation.navigate('Registra', {title: 'You custom title'})
```
これにより、タイトルを更新するためにRegistraのメソッドを呼び出す必要はありません。

それが役に立てば幸い！

bugfix

別のクラスReact NativeからnavigationOptionsを変更する方法

android

reactjs

react-native

関連記事