Как ссылаться на пользовательские компоненты в реакции-родной?

Question

Поэтому у меня есть пользовательский компонент, как это:

class MyComponent extends React.Component { 
    render() { 
    return (
     <TouchableHighlight style={this.props.buttonStyle}> 
     <Text style={styles.buttonText}>Button</Text> 
     </TouchableHighlight> 
    ); 
    } 
} 

И я использую компонент, как это:

class RootView extends React.Component { 
    render() { 
    return (
     <View> 
     <MyComponent/> 
     <MyComponent/> 
     </View> 
    ); 
    } 
} 

RootView изменяемого размера. То, что я хочу сделать, это уменьшить его детей MyComponent, когда RootView достаточно мал. И мне нужно сжать каждый MyComponent за один раз: когда RootView достаточно мал, сжимаем первый MyComponent, а когда первый MyComponent достигнет минимального размера, сжимайте второй MyComponent. Я знаю, что есть refs в реакции-native, но он не работает для настраиваемого компонента.

Answer 1

1. Вы можете добавить реф в пользовательский компонент:

   <Separator ref='sep' style={styles.offsetSeparator} />

   

Таким образом, вы должны быть в состоянии делать то, что вам нужно.

2. Однако, если вы обнаружите, что имеете сильную зависимость между различными компонентами, это означает, что, вероятно, самое подходящее время для начала использования Flux или чего-то подобного, а затем сохранить данные в магазине который будет содержать всю информацию, необходимую для всех трех компонентов. Подробнее о Flux здесь: https://facebook.github.io/flux/