Question

我是学习React / React Native的新手，并遇到了以下问题。点击<TouchableWithoutFeedback>元素时，视图不会增加。

以下代码：

class SingleHabit extends Component {

  constructor() {
    super();
    this.state = {count: 0};
  }

  _incrementCount() {
    this.setState = ({
      count: count + 1
    });
  }

  render () {
    return (
      <TouchableWithoutFeedback onPress={ () => this._incrementCount() }>
        <View
          style= {[
            styles.singleHabit,
            {backgroundColor: this.props.color}
          ]}
        >
          <Text style={styles.habitNameText}>{this.props.text}</Text>
          <Text style={styles.countText}>{this.state.count}</Text>
        </View>
      </TouchableWithoutFeedback>
    );
  }
}

另外，为了自学，无论如何你都会重构这个（或者只是更好的做事方式），我很乐意听到！

Answer 1

您的.split()功能错误。

您永远不会致电(4) ["Adam Brown", "Karl Walser", "Jeremy Smith", "Nathan Graham"] 0 : "Adam Brown" 1 : "Karl Walser" 2 : "Jeremy Smith" 3 : "Nathan Graham"。您将_incrementCount分配给this.setState。纠正它删除({count: count + 1})。
未定义表达式this.setState中使用的=。将其更改为count。

总结，改变

count + 1

到

this.state.count

Answer 2

incrementCount函数中的

this不会自动绑定到类。如果将其更改为使用箭头函数，则this的范围将成为类。如果要根据以前的状态值修改状态，也可以使用可选函数setState：

   _incrementCount = () => {
     this.setState(prevState => ({ count: prevState.count + 1 }));
   }

React Native Increment State onPress

2 个答案: