2017-05-18 66 views
0

我是新來的學習反應,和/陣營和本地人都遇到了以下問題。當點擊<TouchableWithoutFeedback>元素時,視圖不會增加。下面陣營本地增量州onPress

代碼:

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> 
    ); 
    } 
} 

此外,在自主學習的興趣,如果有,反正你會重構這個(或只需更好的做事方式),我很想聽聽!

回答

1

this您incrementCount函數內部不會自動綁定到類。如果將其更改爲使用箭頭函數,則this的範圍將成爲類。如果您想修改基於以前的狀態值的狀態,還需要使用可選功能setState:

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

謝謝,這個工作! +感謝您的良好做法建議:) – Amz

1

_incrementCount功能是錯誤的。

  • 您不打電話this.setState從來沒有。您被分配({count: count + 1})this.setState。糾正它,刪除=
  • 在表達式count + 1使用的count沒有定義。將其更改爲this.state.count

彙總,更改

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

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