1

友人私は、ユーザーがコンポーネント（ビュー）を非表示にする必要があるボタンをクリックし、表示する必要があるボタンを再度クリックすると、実行時に非表示にして表示するという問題があります。

マイコード :

  constructor(props) {
    super(props);
    this.state = {
      isModalVisible : false,
    };
  }

callFunc(){
   if(this.isModalVisible){
     this.setState({isModalVisible:false});
   }else{
     this.setState({isModalVisible:true});
   }
}

render() {
    return (

      <View style = {styles.companyScroll}>
         <Button
          onPress={this.callFunc}
          title="Learn More"
          color="#841584"
          accessibilityLabel="Learn more about this purple button"
         />

        {this.state.isModalVisible &&  <Picker style ={{backgroundColor : 'white'}}
                selectedValue={this.state.language}
                onValueChange={(itemValue, itemIndex) => this.setState({language: itemValue})}>
                <Picker.Item label="Java" value="java" />
                <Picker.Item label="JavaScript" value="js" />
              </Picker>

      </View>
   )
}

私は下の画像が好きです。

ここに画像の説明を入力

4

4 に答える 4

0

コンストラクターで追加

this.callFunc = this.callFunc.bind(this);

onPress で置き換えます

{()=>{ this.callFunc(); }

ここでちょっとした例を見ることができます：

https://snack.expo.io/HkxpgSlPZ

@+

于 2017-08-03T06:23:05.997 に答える
0

react-native-collapsible-view を使用します。それはまさにあなたのニーズに応えているようです。

于 2020-08-31T19:47:09.503 に答える