javascript - 別のコンポーネントからコンポーネント内で宣言されているオブジェクトに到達する - React Native

Question

私は小さな文法アプリを構築しています。ここでは、スナックで簡略化しました

上記のアプリのこれまでの機能

このアプリは、冠詞と名詞の性別の選択に従って、サンプル センテンスを取得して出力します。

標的

私の目的は、単語の種類 (冠詞または名詞) が選択されるたびに、選択された単語の種類の色を明るくすることです。（例えば、定冠詞を選んだ場合'The'は、例文で数秒間黄色にしてください）。そして、文の残りの部分と同じように、冠詞/名詞を黒に戻します。

マイトライ

animatedTextColor別のファイルで変数を宣言しました

//TextColorAnimation.js
...
let animatedTextColor = textColor.interpolate({
        inputRange: [0, 1],
        outputRange: ["rgb(170, 188, 16)", "rgb(0,0,0)"]
    })
    //sending to redux store
    dispatch(setTextColorAC(animatedTextColor))
...

SampleSentencesEnglishオブジェクトのスタイルで使用されます。

//SampleSentences.js
const styles = StyleSheet.create({
  article: {
    color: animatedTextColor
  }
})
const SampleSentencesEnglish = {
 'masculine': {
   'indefinite': <Text>
                  <Text style={styles.article}>A </Text>
                  <Text>man </Text>
                  was looking for you
                 </Text>,
...

使用できるようにコンポーネントをラップstylesして内部に入れましたSampleSentencesEnglishuseSelector

//SampleSentences.js
...
const SampleSentences = (props) => {

            const animatedTextColor= useSelector(textColorSelector);

            const styles = StyleSheet.create({
                    article: {
                        color: animatedTextColor
                  }
            })
                    
            const SampleSentencesEnglish = {
              'masculine': {
                'indefinite': <Text>
                                <Text style={styles.article}>A </Text>
                                <Text>man </Text>
                                was looking for you
                              </Text>,
...
}

export {SampleSentences}

さて、問題は、別のコンポーネントからコンポーネント内にあるオブジェクトに到達できないこと ですSampleSentencesEnglish MainApp.js

  //MainApp.js
  ...
  import {SampleSentences} from './Examples/SampleSentences';
  ...
   <View>
      ...
       <Text>Sample Sentence</Text>

       //Invoking object fails
       <Text>{SampleSentences.SampleSentencesEnglish[currentNounType][currentArticleType]}         
      </Text>
  </View>     

これは動作しないバージョンです。TextColorAnimation.js追加のコンテンツとしてファイルとファイルがあり、最初のリンクと比較しTextColorRedux.jsてモジュールがあります。SampleSentences.js

読んでくれてありがとう。理解できることを願っています。