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

Question

我一直在努力纠正代码中的任何语法错误，但我继续收到“setState Cannot Update during Existing State”错误。我已经参考了类似的线程，但答案似乎并没有很好地适用于我的情况（或者解决方案让我失败了）。

这是我定位为有问题的代码：

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

在这里找到了答案（尽管 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 -道具和状态的纯功能/

Answer 2

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

        this.setState({ searching: false });

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

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