reactjs - react-native 中的实时条件渲染

Question

我试图弄清楚如何基于布尔值渲染组件。但是用户也可以选择更改布尔值，我需要应用程序实时更新。

为简单起见，目前我只尝试渲染一些文本：

const deposit = <Text>deposit</Text>
const noDeposit = <Text>noDeposit</Text>

这是我想要渲染它的视图：

<View>
  {this.props.depositRequired ? deposit : noDeposit}
</View>

它适用于在应用程序首次启动时显示其中一个。但它永远不会更新，我有点不知道如何做到这一点。任何帮助深表感谢！

标签： reactjsreact-native

Answer 1

尝试使用生命周期方法来接收调用的道具componentWillReceiveProps以进行组件更新。像这样实现它：

  componentWillReceiveProps(nextProps){
  if(nextProps.depositRequired !== this.props.depositRequired){
    // just call to update the component
    this.setState({})
  }
}