Формат даты извлекается из API - React

Question

В настоящее время я использую componentDidMount для отображения данных API на моей веб-странице. Большинство данных являются датами, т.е. «срок исполнения», «_field», и они отображаются в виде MM / dd / yyyy HH: mm, однако я хочу переформатировать даты в MM / dd / yyyy на моей веб-странице. не знаю, с чего начать, я знаком с var date = new Date (), но не уверен, будет ли это использоваться в этом случае

        render() {
        var {items} = this.state
        return (
        ....
        <tbody>

        {items.map(item => ( 

            <tr key={item.summary_type}>

            <td> {item.summary_type} </td>
            <td> {item.supplier_status} </td>
            <td> {item.due_date} </td>
            <td> {item.iso_field} </td>
            <td> {item.as_field} </td>
            <td> {item.nadcap_field} </td>
            <td> {item.cert_field} </td>
            <td> {item.extension_field} </td>

            </tr>
            ))}
            </tbody>
            ....

Answer 1

Вы можете создать функцию для возврата первой части необходимой вам даты:

   getDate = (date) => {
     return date.split(' ')[0]
    }

    render() {
    var {items} = this.state
    return (
    ....
    <tbody>

    {items.map(item => ( 

        <tr key={item.summary_type}>

        <td> {item.summary_type} </td>
        <td> {item.supplier_status} </td>
        <td> {this.getDate(item.due_date)} </td>
        <td> {item.iso_field} </td>
        <td> {item.as_field} </td>
        <td> {item.nadcap_field} </td>
        <td> {item.cert_field} </td>
        <td> {item.extension_field} </td>

        </tr>
        ))}
        </tbody>
        ....

Answer 2

Я не уверен в точном вводе или выводе, но вы можете использовать Date.toLocaleDateString , чтобы получить желаемую нужную вам строку даты.

const now = new Date();
const dateString = now.toLocaleDateString({
  weekday: "short",
  year: "numeric",
  month: "2-digit",
  day: "numeric"
})

console.log(dateString);