React Native multiple inputs

Question

I am actually making an app for a little job, that consists in taking 3 dates, and calclating multiple other dates from those 3. These are supposed to be dates for routine checks, etc... I have hit a problem though : I can't find how to handle multiple inputs. I have 3 DatePickers, that look like this :

<DatePicker
    dateMes={this.state.dateMes}
    mode="date"
    placeholder="select date"
    format="DD-MM-YYYY"
    minDate="01-01-1950"
    maxDate="01-01-2050"
    androidMode="spinner"
    showIcon={false}
    onDateChange={this.onDateChange}
/>

With the only thing changing is dateMes (becoming dateInit and dateLast). To initiate those i have :

constructor(props) {
    super(props)
    this.state = { dateMes: "01-01-2000" }
    this.state = { dateLast: "01-01-2000"}
    this.state = { dateInit: "01-01-2000" }
}

I am kind of a noob, so it may be a basic problem. My question is : what do i have to change, and what names do i have to change to have 3 different input to work with.

Thanks for the help !

Rizal Sidik · Accepted Answer · 2017-07-13 04:21:26Z

4

you can add this function :

onDateChange = (state) => (event,value) => {
  this.setState({
    [state]:value
  });
}

and change your code from :

onDateChange={this.onDateChange}

to :

onDateChange={this.onDateChange('your state name'}

for example :

onDateChange={this.onDateChange('dateMes')}

Maybe can help you :) Note: you can change your constructor method to this :

constructor(props) {
  super(props)
  this.state = { 
    dateMes: "01-01-2000",
    dateLast: "01-01-2000",
    dateInit: "01-01-2000"
  }
}

i think it's better, good luck :)

edited Jul 13, 2017 at 4:21

answered Jul 11, 2017 at 13:41

Rizal Sidik

9898 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

General Baguettson Over a year ago

I tested that. I'm getting "Possible Unhandled Promise Rejection (id: 0): ReferenceError: Can't find variable: name" and then a lots of URLs.

Rizal Sidik Over a year ago

sorry for that, can you change [state]:name into [state]:value ?

Collectives™ on Stack Overflow

React Native multiple inputs

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related