2017-11-08 8 views
0

私は反応ネイティブを学び始めています。理解できないことがいくつかあります。これは私のファイルです:react-native私の状態が定義されていない理由

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. SaladsDisplayStateはRender()セクションで定義されていますか? 3.なぜ私のthis.state.saladsはどこにでも定義されていますか?

、私を助けていただきありがとうございます:)

+1

'onPress = {this.changeState()}'は 'onPress = {this.changeState}'にする必要があります。 – bennygenel

答えて

0

をあなただけTouchableOpacityコンポーネントのようなコンポーネントから、あなたがonPress={() => this.changeState()}onPress={this.changeState}を使用する必要があり、ネイティブに反応関数/メソッドを呼び出したいときにしてください。 onPress={this.changeState()}を使用している場合、コンポーネントがプレレンダリングされているときにコードがこの行に達すると、このコードが実行されます。あなたがプレスを実行するのを待つことはありません!

関連する問題