How to show only date in DateTimePicker in react native

Question

I am new to react native. I have created a screen where I am showing date . and I am using DateTimePicker in react native. But the problem is I only want to show date like this => "fri jun 12 2020" or 6 jun 2020 or 6/6/2020 or 6-6-2020. but I am getting date like this.=> Fri Jun 12 2020 05:30:00 GMT+0530(IST). so please help. thanks. In short I dont want display Time

here is my code

<DateTimePicker 
   value={date}           
   mode={mode}
   is24Hour={false}
   display="default" 
   onChange={this.setDate} 
/>

<Text style={{fontSize: 18}}>{String(this.state.dateString)}</Text>

here is my code of onChange . I am getting undefined instead of date = >

setDate = (event,  selectedDate) => {

    const year = selectedDate.getFullYear();
    const  month = selectedDate.getMonth(); 
    const  day= selectedDate.getDate();
  
    const  dateString = `${day}-${month}-${year}`;
    this.setState({date: selectedDate})
    this.setState({dateString: dateString})

 }

excellent! But I think you made a typo there this.setState({Date : date}) — Yoel
No. I think You should check once and try to edit my code please I dont know what to do with that platform.os === ios — Hand Code
This is how you control the visibility of the state according to the platform — Yoel
also setDate = (event, date, selectedDate) => { need to be setDate = (event, selectedDate) => { — Yoel

Yoel Yoel · Accepted Answer · 2021-03-02T18:54:40

add state stringDate

const onChange = (event, selectedDate) => {      
  const year = selectedDate.getFullYear();
  const  month = selectedDate.getMonth()+1; 
  const  day= selectedDate.getDate();

  const  dateString = `${day}-${month}-${year}`;
  setDate(date );
  setDateString(dateString) 
};

then display dateString

   <Text style={{fontSize: 18}}>{String(this.state.dateString)}</Text>

How to show only date in DateTimePicker in react native

1 Answers