如何在ReactJS中将数据yyyy-mm-dd转换为dd / mm / yyyy?

我是ReactJS的初学者,我正在尝试保存一些日期字段。

默认情况下,日期以yyyy-MM-dd格式保存,但是当我能够发送API日期时,格式应为dd/mm/yyyy

我已经尝试使用.toLocaleDateString('pt-BR',{timeZone: 'UTC'});。但是当我这样做时,返回错误:

The specified value "19/8/2020" does not conform to the required format,"yyyy-MM-dd".

这是我在CodeSandBox中输入的代码

然后,在这里获取日期值:

import React,{ useState } from "react";

const NewUser = () => {
  const [data,setData] = useState({
    birthdate: "",admission_date: ""
  });

  const changeField = (field,value) => {
    const auxData = { ...data };
    auxData[field] = value;
    setData(auxData);
  };

  return (
    <div>
      <span>Born</span>
      <input
        id="birthdate"
        type="date"
        value={data.birthdate}
        onChange={(event) => changeField("birthdate",event.target.value)}
      />
      <div />
      <span>Admission Date</span>
      <input
        id="admission_date"
        type="date"
        value={data.admission_date}
        onChange={(event) => changeField("admission_date",event.target.value)}
      />
    </div>
  );
};

export default NewUser;

iCMS 回答:如何在ReactJS中将数据yyyy-mm-dd转换为dd / mm / yyyy?

不要仅仅为了这个简单的任务就导入整个momentjs库。

// yyyy-MM-dd
const input = "2020-08-19"
const [year,month,day] =  input.split('-')

// dd/mm/yyyy
console.log(`${day}/${month}/${year}`)

另外,请查看You-Dont-Need-Momentjs,以获取更轻松的选择,甚至是一些用于处理日期的常见用例的本地方法。

此外,您可能要等到准备好将数据发送到服务器后再应用转换(而不是尝试在changeField中进行此操作)。示例:

Edit friendly-leftpad-cz7jw

本文链接:https://www.f2er.com/1687633.html

大家都在问