单击提交按钮时如何重置模式?

我想再次单击元素以清除先前的值,而不是更改其状态?我想每次用新数据初始化模态。我可以使用unmount解决我的问题吗?如果是的话,如何在这里使用Unmount我从来没有使用过。 This is my view part here i display data This is my modal here i want clear previous selected value

   import React,{ Component } from "react";
   import { Button,View,Text,StyleSheet,flatList,ScrollView} from "react-native";
   import Modal from 'react-native-modal';
   import {validateList} from "../Validation/validation";

  export default class WeeklyModal extends Component {
   constructor(props) {
     super(props);
     this.state = {
        list: [],visibleModal: false
      };
    }
 _validate() {
      if (validateList(this.state.list).status) {
         const a = this.state.list
         const  b =  a.toString()
         console.log(b)
        this.setState({ visibleModal: null,list:[b] })
      } 
          else {
              alert("select list date")
              } 
        this.resetDate();
  }

  resetDate = () => {
    this.setState( { visibleModal: null } );
  };

getListViewItem = (item) => {
    let newList = this.state.list;
    if (newList.includes(item)) {
        let index = newList.indexOf(item);
        newList.splice(index,1);
        } else {
        newList.push(item);
    }
    this.setState({
        list: newList,});
}

 renderModalContent = () => (
<View>  
    <View style = {{backgroundColor:'white'}}>
        <View>
          <flatList horizontal={true} 
              data = {[{day: '1'},{day: '2'},{day: '3'},{day: '4'},{day: '5'},{day: '6'},{day: '7'}]}
              renderItem={({item,index}) =>
                  <Text style={styles.textBox} key={index}
                        onPress={this.getListViewItem.bind(this,item.day)}>{item.day}
                  </Text>}
          />
           <Text style={{fontSize:20,color:'black',textAlign:'center'}}>{this.state.list} </Text>
            <ScrollView
              style = {{marginHorizontal: 20}} 
              horizontal={true}
            > 
              {
              this.state.list.map((l,index) => {
                  return(
                 index !== this.state.list.length - 1 ? <Text style={{fontSize:30,color:'red'}}>{l},</Text> : <Text style={{fontSize:30,color:'red'}}>{l}</Text>
                  )
                })
              }
            </ScrollView>
            </View>
       </View>
  <Button onPress={() => this._validate()} title="Submit" />
  </View>
  );

 render() {
  return (
    <>
   <Text style={{fontSize:20}}>Frequency</Text>
        <View style={styles.container} >
            <Text style={styles.textBox}  onPress={() => this.setState({ visibleModal: 'default' })}>Weekly </Text>
          </View>
          <Text style={{fontSize:20,textAlign:'center'}}>{this.state.list} </Text>
       <Modal isVisible={this.state.visibleModal === 'default'} 
         onBackButtonPress={() => this.setState({ visibleModal: null })}>
         {this.renderModalContent()}
       </Modal> 
     </>
  );
 }
}
Reakie2008 回答:单击提交按钮时如何重置模式?

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/3161304.html

大家都在问