如何使用react显示任务创建的时间
如何使用react显示任务创建的时间
提问于 2019-04-21 08:24:01
我想要显示使用以太坊在我的待办事项应用程序中创建任务的时间。
我得到了task，其中包括content和time，并在这段代码中按状态设置任务。
constructor(props) {
super(props)
this.state = {
tasks: [],
}
}
・・・
for (var k = 1; k <= taskCount; k++) {
const task = await todoList.methods.tasks(k).call()
this.setState({
tasks: [...this.state.tasks, task]
})
}然后，我使用map来显示tasks数组和time。
{ this.props.tasks.map((task, key) => {
return(
<div key={key}>
<p>{task.content}</p>
<p>{task.time}</p>
</div>
)
})}结果，我得到了像这样的数字
1555650125
1555651118
1555651169
1555664902因此，我将{task.time}更改为{Date(checkin.checkintime)}，以便将该数字转换为正常时间。但是，结果仅显示数字。
Sat Apr 20 2019 09:20:57
Sat Apr 20 2019 09:20:57
Sat Apr 20 2019 09:20:57
Sat Apr 20 2019 09:20:57 我写这段代码是为了检查Data()是否正常工作，这样我就可以得到正确的答案。
for (var k = 1; k <= taskCount; k++) {
const task = await todoList.methods.tasks(k).call()
const tasktime = new Date(task.checkintime * 1000)
console.log(tasktime)
this.setState({
tasks: [...this.state.tasks, task]
})
}Fri Apr 19 2019 14:02:05
Fri Apr 19 2019 14:18:38
Fri Apr 19 2019 14:19:29
Fri Apr 19 2019 18:08:22 你能给我一些建议来显示地图上的时间吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-04-22 04:39:24
在本节中，我假设task是刚刚创建的新任务。您可以使用时间字符串更新task.checkintime属性：
const task = await todoList.methods.tasks(k).call()
task.checkintime = new Date(task.checkintime * 1000).toDateString();
this.setState({
tasks: [...this.state.tasks, task]
})这意味着它将在您的地图中访问：
{ this.props.tasks.map((task, key) => {
return(
<div key={key}>
<p>{task.content}</p>
<p>{task.checkintime}</p>
</div>
)这将获取https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString并在task.checkintime上指定日期的字符串表示形式。
如果你想做不同的格式化，看看How to format a JavaScript date，这样你就可以格式化你的Date对象。
Stack Overflow用户
发布于 2019-04-22 04:21:51
task.time是由UNIX time epoch系统定义的时间。在此基础上，您可以转换为任何格式。不知道你想展示什么，但new Date(task.time)似乎是朝着正确方向迈出的一步。如果还不够，可以参考Date reference或Moment.js。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55778866
复制相关文章
相似问题
腾讯云开发者
