对象作为React子对象无效(找到:[object Date])

Question

我目前正在开发一个简单的应用程序，允许用户上传照片。

我正在尝试使用exif.fr 显示所有exif数据

目前的问题出现在我要显示的DateTimeOriginal对象属性中。

如果我从exif对象中排除了所有日期，我可以显示

下面是显示exif数据的组件，我在中遇到了问题

import React, { useEffect, useState } from "react";
import { useContext } from "react";
import { Context } from "../hook/Context";
export default function Modal() {
const { uploadso, onImageChange, imgDat, data } = useContext(Context);
const [upload, setUpload] = uploadso;
const [img, setImgData] = imgDat;
const [datas, setData] = data;
const omittedProps = ["CreateDate", "ModifyDate"];
return (
<div>
{!upload && (
<div>
<input
type="file"
multiple
accept="image/*"
onChange={onImageChange}
/>
</div>
)}
{!upload && !img && (
<div>
{datas.map((each) => {
if (datas == undefined || datas == null) {
return;
} else {
return [
Object.keys(each).map((key, index) => {
return (
!omittedProps.includes(key) && (
<div key={index}>
{key}:{each[key]}
</div>
)
);
}),
];
}
})}
</div>
)}
</div>
);
}

如果我没有排除要呈现的DateOfOriginal，并且我已经排除了CreatedTime和ModifyDate，并且每个日期都具有对象属性，则会显示此错误

Uncaught Error: Objects are not valid as a React child (found: [object Date]). If you meant to render a collection of children, use an array instead.
at throwOnInvalidObjectType 

这是我试图显示的数据

{
"Make": "Canon",
"Model": "Canon DIGITAL IXUS",
"Orientation": "Horizontal (normal)",
"ModifyDate": "2001-06-09T07:17:32.000Z",
"YCbCrPositioning": 1,
"ExposureTime": 0.002857142857142857,
"FNumber": 4,
"ExifVersion": "2.1",
"DateTimeOriginal": "2001-06-09T07:17:32.000Z",
"CreateDate": "2001-06-09T07:17:32.000Z",
"CompressedBitsPerPixel": 3,
"ShutterSpeedValue": 8.451217651367188,

}

Answer 1

使用此链接中的momentjs修复了它

{key}:{moment(each[key]).format("DD-MM-YYYY")}