在渲染函数中设置状态是一个好的解决方案吗？答案

【问题标题】：Is setting state inside render function an ok solution?在渲染函数中设置状态是一个好的解决方案吗？
【发布时间】：2020-04-27 06:58:23
【问题描述】：

我在位于 render() 内部的一些组件中设置状态，我想知道这是否是设置状态的好方法：

<TextInput style={{ fontSize: 14, marginLeft: 10, marginRight: 10, color: 'black', borderColor: 'gray', borderWidth: 1, textAlignVertical: 'top' }}
                    onChangeText={(txt) => this.setState({ waitReason: txt })}
                    autoFocus
                    multiline={true}
                    numberOfLines={3}
                    placeholderTextColor='gray'
                    placeholder='Comment'
                    value={this.state.waitReason} />

或者也许调用一个函数然后在该函数中设置状态可能是一个更好的解决方案？！

【问题讨论】：

调用单独的函数可能会使代码更易于维护，但我认为您当前的方法没有问题。它是否按预期工作？
@shennan 它确实工作得很好，但我想知道这是否会使我的应用程序不必要地重新渲染或以某种方式影响性能
在状态变化时重新渲染是使用 React 的主要目标之一。只要您对 React 的整体性能感到满意，这种方法应该没问题。

标签： react-native render setstate

【解决方案1】：

请记住，您不是在实际渲染中设置状态。您正在渲染一个组件并在事件处理程序中设置状态。因此，在您的代码中，仅在调用 onChangeText 处理程序时才执行重新渲染，这仅在文本更改时进行。

你的方法应该没问题。分离到不同的函数不会改变代码的性能，但可能会使其更易于维护。

您的方法在React Native documentation 本身中几乎被用作示例。

【讨论】：

【解决方案2】：

setState inside render 没有问题，但为了保持标准代码，应该使用handleChange等函数，或者当需要在特定事件上设置状态时使用on click函数。

【讨论】：

在一种情况下，实际在 render() 中设置状态是在应用程序启动时在开始时调用的，所以我必须先调用一个函数并在该函数中设置状态。
是的，在这种情况下，您应该最有可能在函数调用或事件处理上设置状态，这样您就可以做到这一点并防止自己在应用启动时设置状态。
我不明白如果我还没有按下 TouchableOpacity，为什么会调用它？

【解决方案3】：

是的，可以在渲染中设置状态，尤其是在处理用户输入时。
就像在 react-native documentation

【讨论】：