流星和ReactJS -从MongoDB检索到字符串的日期

Meteor and ReactJS - Date retrieved from MongoDB to String?

本文关键字:字符串 日期 检索 MongoDB ReactJS 流星      更新时间:2023-09-26

我遵循Meteor教程与ReactJS变体,同时做一些实验。我是Meteor, React和Mongo的新手。我的背景是PHP, SQL和JS。

当前我有一个集合(表)'tasks'用于存储文档(行),其中包含字符串类型的'text'字段和日期类型的'createdAt'字段。

允许显示'task',使用以下代码:

// Task component - represents a single todo item
export default class Task extends Component {
  render() {
    return (
      <li>
        <span className="text">{this.props.task.text}</span>
      </li>
    );
  }
}

现在,我想显示任务的'createdAt'属性。知道它来自javascript Date类型,我尝试如下:

return (
    <li>
       <span className="text">{this.props.task.text}</span><br/><br/>
       <span className="createdAt">{this.props.task.createdAt}</span>
    </li>
);

return (
    <li>
       <span className="text">{this.props.task.text}</span><br/><br/>
       <span className="createdAt">{this.props.task.createdAt.toString()}</span>
    </li>
);

在执行此操作时,任务不再显示,并且在检查应用程序时得到以下错误信息:

不变量冲突:对象作为React子对象无效(发现:2016年10月07日星期五22:11:07 GMT+0200(罗曼史夏令时))。如果你用于呈现子集合,请使用数组或换行使用来自React附加组件的createFragment(object)来创建对象。检查Task的渲染方法

我仍然对React感到困惑。这个指向React子节点的错误信息是什么意思?我该怎么补救呢?

momentjs是一个非常好的显示和操作日期和时间的库。您可以在createdAt中使用

<span className="createdAt">
  {moment(this.props.task.createdAt).format(/*valid format, e.g. DD/MM/YYYY*/)
</span