[英]Objects are not valid as a React child (found: object with keys {_delegate}). If you meant to render a collection of children, use an array instead
react-dom.development.js:14887 Uncaught Error: Objects are not valid as a React child (found: object with keys {_delegate}). react-dom.development.js:14887 未捕获错误:对象作为 React 子项无效(发现:object 键为 {_delegate})。 If you meant to render a collection of children, use an array instead.如果您打算渲染一组子项,请改用数组。
This is the object这是 object
const post = [
{
id: 1,
name: "Farish Jamal",
description: "Web Developer",
time: new Date().toLocaleTimeString(),
message: "This is forat",
photoUrl: "",
timestamp: firebase.firestore.FieldValue.serverTimestamp()
},
{
id: 6,
name: "Farish Jamal",
description: "Web Developer",
time: new Date().toLocaleTimeString(),
message: "This is forat",
photoUrl: "",
timestamp: firebase.firestore.FieldValue.serverTimestamp()
},]
This is where i am fetching the data这是我获取数据的地方
<div className='feed__post'>
{post.map(({id, name, description, message, photoUrl, timestamp }) =>(
<Post
key={id}
name={name}
description={description}
message={message}
photoUrl={photoUrl}
time={timestamp}
/>
))}
</div>
Your timestamp value firebase.firestore.FieldValue.serverTimestamp()
is returning (what is being considered) an object and the time
prop is not being processed properly by your <Post>
component.您的时间戳值firebase.firestore.FieldValue.serverTimestamp()
正在返回(正在考虑的内容) object 并且您的<Post>
组件未正确处理time
属性。
Does the error go away when you remove this time={timestamp}
删除这个time={timestamp}
时是否会出现错误go
<div className='feed__post'>
{post.map(({id, name, description, message, photoUrl, timestamp }) =>(
<Post
key={id}
name={name}
description={description}
message={message}
photoUrl={photoUrl}
/>
))}
</div>
I'm not 100% on exactly the best way to process the object returned from serverTimestamp()
but I'm referring to this post suggesting:我不是 100% 完全了解处理从serverTimestamp()
返回的 object 的最佳方法,但我指的是这篇文章,建议:
firebase.firestore.FieldValue.serverTimestamp().toDate()
which will give you a JS Date
object, which you should be able to process into a string with .toLocaleTimeString()
firebase.firestore.FieldValue.serverTimestamp().toDate()
将为您提供 JS Date
object,您应该能够使用.toLocaleTimeString()
将其处理成字符串
How to get a JavaScript Date object from the new `firebase.firestore.FieldValue.serverTimestamp()` 如何从新的`firebase.firestore.FieldValue.serverTimestamp()` 获取 JavaScript 日期 object
firebase.firestore.FieldValue.serverTimestamp().toDate().toLocaleTimeString()
all elements is inside in one object and you need to check the length first...所有元素都在一个 object 中,您需要先检查长度...
<div className='feed__post'>
{(post.length > 0) && post.map(item =>(
<Post
key={item.id}
name={item.name}
description={item.description}
message={item.message}
photoUrl={item.photoUrl}
time={item.timestamp}/>
))}
</div>
you should pass any of objects in your object array in map function:您应该在 map function 中传递 object 数组中的任何对象:
<div className='feed__post'>
{post.map(item =>(
<Post
key={item.id}
name={item.name}
description={item.description}
message={item.message}
photoUrl={item.photoUrl}
time={item.timestamp}/>
))}
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.