社区首页 >问答首页 >如何显示从防火墙检索的时间戳类型元素

如何显示从防火墙检索的时间戳类型元素
EN

Stack Overflow用户
提问于 2020-08-13 12:13:02
回答 1查看 281关注 0票数 0

我想显示用Firestore创建的集合的内容,我有一个字段"date“,它的类型是时间戳

当我想显示值​​时,我得到一个错误:

错误:对象作为React子对象无效(找到:键为{秒的对象,纳秒})。如果您打算呈现一个子集合,请使用数组代替。

我将集合的内容显示在@material中的一个表中。

index.js

代码语言:javascript
代码运行次数:0
复制
import Table from '@material-ui/core/Table';
import TableBody from '@material-ui/core/TableBody';
import TableCell from '@material-ui/core/TableCell';
import TableContainer from '@material-ui/core/TableContainer';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import Paper from '@material-ui/core/Paper';
import { FirebaseContext } from '../Firebase'



const Welcome = () => {

    const firebase = useContext(FirebaseContext);
    const [nameColl, setNameColl] = React.useState([]);
   
      React.useEffect(() => {
        const fetchData = async () => {
          const db = firebase.db;
          const data = await db.collection("nameColl").get();
          setNameColl(data.docs.map(doc => ({ ...doc.data(), id: doc.id })));
        };
        fetchData();
      }, []);

      return(
                <TableContainer component={Paper}>
                    <Table aria-label="simple table">
                        <TableHead>
                        <TableRow>
                            <TableCell align="right"> Date&nbsp;</TableCell>
                        </TableRow>
                        </TableHead>
                        <TableBody>
                        {nameColl.map(nameColl => (
                            <TableRow key={nameColl.id}>
                            <TableCell align="right"> {nameColl.date} </TableCell> 
                            </TableRow>
                        ))}
                        </TableBody>
                    </Table>
                    </TableContainer>
          )

firebase.js

代码语言:javascript
代码运行次数:0
复制
import app from 'firebase/app';
import 'firebase/firestore'

const config = {...};


class Firebase{

    constructor(){
        app.initializeApp(config)
        this.db = app.firestore();
    }
   
}

export default Firebase;
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-08-13 12:21:55

当您向视图提供Fi还原时间戳对象时,您必须弄清楚实际想要显示什么。我想,这个问题是在这样做时发生的:

代码语言:javascript
代码运行次数:0
复制
<TableCell align="right"> {nameColl.date} </TableCell> 

错误消息表明您不能在这里提供一个对象。您可能需要某种类型的字符串格式。时间戳对象不会为您设置自己的格式(它不知道您实际需要什么)。但是您可以将时间戳转换为日期,然后将其转换为默认的字符串格式:

代码语言:javascript
代码运行次数:0
复制
<TableCell align="right"> {nameColl.date.toDate().toString()} </TableCell> 

但你最终还是会发现你真正想要的是什么,如果这对你不起作用的话。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63402583

复制
相关文章
【Apache Ant】ANT解析以及ANT在myEclipse中的使用
Apache Ant,是一个将软件编译、测试、部署等步骤联系在一起加以自动化的一个工具,大多用于Java环境中的软件开发。
谙忆
2021/01/21
1.5K0
【Apache Ant】ANT解析以及ANT在myEclipse中的使用
为什么在静态方法中不能使用this
在JVM的运行时数据区中有个虚拟机栈(或Java栈),在它的里面是由栈帧'叠加'而成.栈帧由局部变量表,操作数栈,动态连接,方法返回地址等组成.
书唐瑞
2022/06/02
1.9K0
为什么在静态方法中不能使用this
在vue的v-for中,key为什么不能用index?
在前端中,主要涉及的基本上就是 DOM的相关操作 和 JS,我们都知道 DOM 操作是比较耗时的,那么在我们写前端相关代码的时候,如何减少不必要的 DOM 操作便成了前端优化的重要内容。
bb_xiaxia1998
2022/10/01
1.1K0
在vue的v-for中,key为什么不能用index?4
在前端中,主要涉及的基本上就是 DOM的相关操作 和 JS,我们都知道 DOM 操作是比较耗时的,那么在我们写前端相关代码的时候,如何减少不必要的 DOM 操作便成了前端优化的重要内容。
bb_xiaxia1998
2023/01/06
1.1K0
cmake:在Makefile中运行ant脚本
版权声明:本文为博主原创文章,转载请注明源地址。 https://blog.csdn.net/10km/article/details/51832822
10km
2019/05/25
1.7K0
为什么我退出了编程工作
从很小的时候就在印度出生和成长,在那里我们只有少数的职业选择。工程师和医生是很多人的头两个选择。现在,随着互联网的兴起,事情正在发生变化,但是父母期望孩子成为医生或工程师的情况并不少见。
程序那些事儿
2023/03/07
3150
为什么我退出了编程工作
在ReadWriteLock类中读锁为什么不能升级为写锁?
关于读写锁里面有一个锁升级和降级的问题,也就是写锁可以降级为读锁,但是读锁却不能升级为写锁。那么为什么是这样?
我是攻城师
2018/08/03
3K0
nextline函数_在JAVA中Scanner中的next()和nextLine()为什么不能一起使用?
Java 输入一直是一个坑,本来一直用 Scanner,但一直搞不懂换行符啥的,就用 BufferReader ,但前不久大疆笔试需要持续输入,早忘了 Scanner 怎么写,而那个场景用 Scanner 很好实现 ……
全栈程序员站长
2022/09/05
2.7K0
java中的ant详解
概念到处可查到,形象来说,你要把代码从某个地方拿来,编译,再拷贝到某个地方去等等操作,当然不仅与此,但是主要用来干这个
botkenni
2021/09/23
1.1K0
晶振为什么不能放置在PCB边缘?
某行车记录仪,测试的时候要加一个外接适配器,在机器上电运行测试时发现超标,具体频点是84MHz、144MHz、168MHz,需要分析其辐射超标产生的原因,并给出相应的对策,辐射测试数据如下:
AI 电堂
2022/12/08
3730
晶振为什么不能放置在PCB边缘?
我在 Z 厂的半年工作总结
Z厂前: 在一家K12教育公司(简称S厂),定位是测试开发岗位,主要负责效能工具研发、自动化、服务端压测、测试环境治理,带5人小团队.S厂的测试和测开分发的,测开不负责业务,所以到最后会感觉到脱离业务比较多,S厂离职后面试很吃亏,比如: 美团、阿里、便利峰,技术能力没啥问题,主要是简历中无法体现所负责的业务价值.
测试加
2022/04/27
6660
我在 Z 厂的半年工作总结
Ant中的SVN 使用
最近在调整SDK的打包脚本的时候重新树立了一下ant下面的SVN命令的用法。先简单列举下,以后有精力再慢慢整理细说吧。 svn copy 多用于生成当前版本的tag <arg line="copy SVN_URL1 SVN_URL2 --no-auth-cache --non-interactive --username USERNAME --password PASSWORD -m MSG" /> </exec> svn add 多用于提交在版本打包过程生成的重要文件,例如代码混淆生成的mapp
子勰
2018/05/22
8900
在java中String类为什么要设计成final?
final的出现就是为了为了不想改变,而不想改变的理由有两点:设计(安全)或者效率。
一觉睡到小时候
2019/07/02
9330
在java中String类为什么要设计成final?
在java中String类为什么要设计成final?
String很多实用的特性,比如说“不可变性”,是工程师精心设计的艺术品!艺术品易碎!用final就是拒绝继承,防止世界被熊孩子破坏,维护世界和平!
用户1205080
2018/09/12
1.1K0
在java中String类为什么要设计成final?
工作中我常用的分析算法
统计性描述更为侧重单变量的描述,即描述X、X与X之间的关系,在通过X去描述Y的时候,我更关心X与Y间存在何种关系,此时便需要借助散点图去印证X与Y相关的内在一致性,并通过方差、协方差过渡到统计相关的本质。
许卉
2019/09/24
6310
工作中我常用的分析算法
在IT开发中工作种类的分类
可能很多同学在学习python之前都听说过什么:前端程序员,后端程序员,安全工程师,运维,爬虫,全栈程序员等等各种各样的头衔名称,搞得大家都不知道该怎么选择了。我当初学编程之前也有过类似的经历,所以这里我尽可能给大家解释明白。
python自学网
2021/11/27
9510
在IT开发中工作种类的分类
我在 IBM 从事开源工作的十一年
编者说:  在国际知名公司从事开源工作是一种怎样的体验?  目前越来越多的来自中国的企业、组织或开发者,都纷纷投身到全球技术的开源生态建设大潮中,甚至将开源作为一份全职工作。那在如火如荼的开源热浪中,国内开源爱好者们在国际开源舞台上的参与度如何?作为开源新兵,又该如何步入或活跃于国际开源组织,在开源社区中建立自己的声誉和话语权呢?  带着这些问题,腾源会采访了在 IBM 公司从事 11 年开源工作的高级工程师侯胜博,和他聊聊在 IBM 参与开源背后的那些成长故事,以及在开源社区参与大规模协作过程中所收
腾源会
2021/11/11
5360
聊聊我在腾讯和字节工作感受
大家好,我是鱼皮,最近这段时间,应该是正值大三的小伙伴最忙碌的时候,不少同学都在准备秋季校园招聘。
程序员鱼皮
2021/08/12
3.3K0
谈谈在我在外包公司工作的经历
来源:zhihu.com/question/52994936/answer/958545980
JAVA葵花宝典
2020/11/04
2.5K0
谈谈在我在外包公司工作的经历
在应用开发中,我为什么选择 Flutter 而不是 React Native ?
作为一位开发人员,我想在本文中与大家聊聊跨平台开发领域的两大核心选项——Flutter 与 React Native 框架,并介绍我自己为什么更偏爱 Flutter。
逆锋起笔
2021/01/28
3.3K0

相似问题

输入的defaultValue在ant设计上不能正常工作

6606

为什么我的Ant主构建文件不能正常工作?

32

为什么`<Input>`在Ant设计中没有变化?

12

Ant设计卡不能正确对齐

239

为什么我的混合模型循环不能工作?(RStudio,交叉设计)

14
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档