如何在 react-native 中引用自定义组件？答案

【问题标题】：How to reference custom components in react-native?如何在 react-native 中引用自定义组件？
【发布时间】：2015-11-19 03:58:05
【问题描述】：

所以我有一个这样的自定义组件：

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 可调整大小。我想做的是在RootView 足够小的时候缩小它的孩子MyComponent。我需要一次缩小每个MyComponent：当RootView足够小时，缩小第一个MyComponent，当第一个MyComponent达到最小尺寸时，缩小第二个MyComponent。我知道 react-native 中有 refs，但它似乎不适用于自定义组件。

【问题讨论】：

标签： react-native

【解决方案1】：

您可以为自定义组件添加 ref：

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

所以你应该能够做你需要的。

但是，当您发现自己在不同组件之间有很强的依赖关系时，这意味着可能是开始使用 Flux 或类似的东西的好时机，然后将数据保存在 Store 中，该 Store 将包含所有 3 所需的所有信息组件。更多关于通量的信息：https://facebook.github.io/flux/

【讨论】：