為什么我的狀態不確定

Question

我開始學習本機反應，有些事情我聽不懂。 這是我的文件：

import React from 'react';
import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
import SaladsList from './SaladsList';
import salotos from '../Classes/Salads';

export default class SaladsContainer extends React.Component {
constructor(props) {
  super(props);
    this.state = { salads: salotos,
                   SaladsDisplayState: true
             };
    this.changeState = this.changeState.bind(this);
  }
   changeState() {
      /* if (this.state.SaladsDisplayState === false) {
       this.setState.SaladsDisplayState = true;
      } else if (this.state.saladsDisplayState === true) {
        this.setState.SaladsDisplayState = false;
      }
      console.log(this.state.saladsDisplayState);
      */
      console.log('Veikia funkcija');
      console.log(this.state.salads);
      }
    renderSaladsList() {
      if (this.state.SaladsDisplayState) {
    return this.state.salads.map(salad => <Text style={Styles.saladsText}>{salad.Name}</Text>);
  } else {
    return <TouchableOpacity onPress={this.changeState()}><Text style={Styles.saladsText}>Salotos</Text></TouchableOpacity>
  }
  }
  render() {
    console.log(this.state.SaladsDisplayState);
    return (
      <View style={Styles.saladsContainer}>
      {this.renderSaladsList()}
      </View>
    );
  }
}

1.為什么當我按下按鈕this.state.SaladsDisplayState沒有定義？ 2.為什么在Render（）部分定義了SaladsDisplayState？ 3.為什么我的this.state.salads到處都有定義？

請幫助我，謝謝:)

Answer 1

當您想在React Native中從TouchableOpacity組件之類的組件中調用函數/方法時，應使用onPress={() => this.changeState()}或onPress={this.changeState} 。 如果您正使用onPress={this.changeState()} ，則在組件預渲染時，當代碼到達此行時，它將執行此代碼。 它不會等待您執行新聞！