0

Tengo un datepicker del plugin npm i react-native-date-picker y funciona sin problemas pero necesito que al seleccionar la fecha me arroje la fecha que seleccione en campo input pero no lo he logado hacer.

import React, { useState } from 'react'
import { Button } from 'react-native'
import DatePicker from 'react-native-date-picker'

export default () => {
  const [date, setDate] = useState(new Date())
  const [open, setOpen] = useState(false)

  return (
    <>
      <Button title="Open" onPress={() => setOpen(true)} />
      <DatePicker
        modal
        open={open}
        date={date}
        onConfirm={(date) => {
          setOpen(false)
          setDate(date)
        }}
        onCancel={() => {
          setOpen(false)
        }}
      />
    </>
  )
}

1 respuesta 1

2

Tenía el mismo problema y lo revolví de la siguiente forma:

Al parecer no se puede mostrar un Date en JSX por lo tanto hice lo siguiente:

    <TouchableOpacity activeOpacity={0.8} onPress={() => setOpen(true)}>
        <Text>Fecha</Text>
        <Text> {fechaFormato} </Text>
      </TouchableOpacity>
    </View>


    <DatePicker
      modal
      open={open}
      mode="date"
      date={date}
      onConfirm={date => {
        setOpen(false);
        formatFecha(date);
      }}
      onCancel={() => {
        setOpen(false);
      }}
    />
    

Al momento de querer guardar la fecha envié la misma hacia un método que la transforma en string y así la puedo mostrar.

 const [date, setDate] = useState(new Date());
 const [fechaFormato, setFechaFormato] = useState('');


 const formatFecha = fecha => {
    setDate(fecha);
    const dia = fecha.getDate();
    const mes = fecha.getMonth() + 1;
    const anio = fecha.getFullYear();
    setFechaFormato(`${dia}/${mes}/${anio}`);
  };

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.