スタイリッシュなコンポーネントと反応的に親の小道具

Question

私は反応のネイティブプロジェクトでスタイル付きのコンポーネントを使用しています。子要素から親の小道具を取得するにはどうすればいいでしょうか？ 2スタイル・コンポーネント

const First = styled.View` 
    display: flex; 
    width: 50px; 
    height: 50px; 
    background-color: ${props => props.selected ? 'blue' : 'red'}; 
` 
const Second = styled.Text` 
    // here I want to check if First has the selected prop. 
    color: ${props => props.selected ? '#fff' : '#000'}; 
` 

と私自身のリアクトコンポーネント

const Test =() = (
    <First selected> 
    <Second>Test</Second> 
    </First> 
) 

今（Firstです）Seconds父親がselected小道具を持っている場合はどうなりますか？私がチェックする方法 選択したattrをSecondにするとうまくいくことは分かりますが、それは達成しようとしているものではありません...入れ子になっているために方法が必要です。ログと小道具をコンソールにしようとしましたが、子が返すオブジェクト内の親値を見つける。

ありがとう

Answer 1

リアクションのパターンに従う場合は、1つの方法があります。同じ小道具を<second>に渡す。

あなたがが何ができるか、子供に新しい小道具として親の小道具を渡して、次の

const Test =() = (
    <First selected> 
    <Second isParentSelected={selected} >Test</Second> 
    </First> 
) 

、その後

const Second = styled.Text` 
    color: ${props => props.isParentSelected ? '#fff' : '#000'}; 
`