Question

我一直在撞墙试图纠正我的代码中的任何语法错误，但我继续得到“setState无法在现有状态期间更新”错误。我已经参考了类似的线程，但答案似乎并没有真正适用于我的情况（或解决方案让我失望）。

以下是我遇到问题的代码：

getInitialState: function() {
        return {
            searching: false,
        anim: new Animated.Value(305),
            user: null,
            isLoaded: false,
            dataSource: new ListView.DataSource({
          rowHasChanged: (row1, row2) => row1 !== row2,
      }),
        }
    },
render: function() {
   return <View>
     <View style={styles.mainView}>
        { this.renderProperElement() }
     </View>
}, 
renderProperElement: function() {
        var that = this;
        return <Animated.View
                style={[styles.searchWrapper, {transform: [{translateX: this.state.anim}]}]}>
                <TouchableOpacity style={styles.icon}  onPress={that.startSearch()}>
                    <Image style={styles.icon} source={require('../img/search.png')} />
                </TouchableOpacity>
                <TextInput style={styles.searchInput} autoFocus = {true} />
                <TouchableOpacity onPress={that.stopSearch()} style={styles.icon}>
                    <Image style={styles.icon} source={require('../img/cancel.png')} />
                </TouchableOpacity>
            </Animated.View>
    },
    startSearch: function() {
        this.setState({ searching: true });

        Animated.timing(
             this.state.anim,
             {
                 toValue: 0,
                 easing: Easing.elastic(1),
             }
        ).start();
    },
    stopSearch: function() {
        Animated.timing(
             this.state.anim,
             {
                 toValue: 305,
                 easing: Easing.elastic(1),
             }
        ).start();
    },

特别是，代码单独调出了render中的函数调用和startSearch函数：

非常感谢任何帮助。

Answer 1

您已将状态设置为搜索：当您第一次按下可触摸的不透明度时为true，但您从未在停止搜索方法上更改过该状态，因此您最好在停止搜索方法中将搜索状态更改为false：

        this.setState({ searching: false });

因此，当您再次设置此搜索状态时，您的应用程序将产生您所需的条件。

由于尝试使用与之前相同的值更改状态条件，可能会发生此错误。

Answer 2

在这里找到了答案（虽然React现在警告我，我正在将组件方法绑定到组件，并且RN会自动为我执行此操作（但它没有）。（

了解详情：http://4dev.tech/2016/03/reactjs-error-cannot-update-during-an-existing-state-transition-such-as-within-render-render-methods-should-be-a-pure-function-of-props-and-state/

尽管语法正确，但在现有状态转换期间，setState无法更新

2 个答案: