根据状态更改组件答案

【问题标题】：Changing components based on state根据状态更改组件
【发布时间】：2017-11-27 04:19:55
【问题描述】：

我在 react-native 工作。我的移动应用程序中有一个表单页面，并且有一个编辑按钮和后退按钮。单击编辑按钮后，我想要一个保存和取消按钮来替换编辑和返回按钮，它们应该有自己的功能。我在我的渲染函数中尝试了componentWillUpdate() 和if else 语句，但似乎都不起作用。

【问题讨论】：

你不需要为这样的事情使用生命周期函数。只需有一个state 变量来控制编辑模式并有条件地渲染按钮。例如onPress={() => { this.setState({ editing: true }) } 和{this.state.editing && <BackButton />}。 React 将根据状态的变化来处理重新渲染。另外，请发布一些代码！
谢谢！真的很有帮助！

标签： react-native render

【解决方案1】：

您可以将所有按钮放在渲染函数中，由状态控制（例如 inEditMode）。当用户单击编辑按钮时，您可以将 inEditMode 设置为 true 并显示编辑和返回按钮。

类似这样的：

   render() {
     this.state.inEditMode ? 
       <View>
          <EditButton />
          <BackButton />
       </View> :
       <View>
          <CancelButton />
          <SaveButton />
       </View>
   }

【讨论】：