Javascript 如何使用状态在React.js中显示日期？

我试图使用React.js显示日期，但由于某些原因，它没有显示任何内容

我是一个初学者，如果我问了一个愚蠢的问题，我很抱歉，但我不明白为什么它不起作用。有人能帮我吗？非常感谢

class App extends React.Component {
  state = {
    date: ""
  };

  getDate() {
    var date = { currentTime: new Date().toLocaleString() };

    this.setState({
      date: date
    });
  }

  render() {
    return (
      <div class="date">
        <p> ddd {this.state.date}</p>
      </div>
    );
  }
}

export default App;

类应用程序扩展了React.Component{
状态={
日期：“”
};
getDate（）{
var date={currentTime:new date（）.toLocaleString（）}；
这是我的国家({
日期：日期
});
}
render（）{
返回(
ddd{this.state.date}

);
}
}
导出默认应用程序；

尝试执行以下操作：

var date = new Date();
this.setState({ date });

而不是

var date = {currentTime: (new Date()).toLocaleString()}
this.setState({date:date });

并检查当前日期是否显示

然后查看如何使用某种格式更改日期字段

---

希望这对您有所帮助

您正在尝试获取日期的状态，而无需先明确设置日期。考虑到这一点，可以用如下方式调用

getDate（）

方法：

从那里，您应该能够在渲染调用中检索它：

render() {
  return (
    <div class="date">
      <p> ddd {this.state.date}</p>
    </div>
  );
}

---

我建议你抬头看看

由于从未调用getDate（），因此未设置该状态，因此只能得到一个空字符串

import React from "react";

export default class App extends React.Component {
  state = {
    date: ""
  };

  componentDidMount() {
    this.getDate();
  }

  getDate = () => {
    var date = new Date().toDateString();
    this.setState({ date });
  };

  render() {
    const { date } = this.state;

    return <div>{date}</div>;
  }
}

从“React”导入React；
导出默认类App扩展React.Component{
状态={
日期：“”
};
componentDidMount（）{
这个是.getDate（）；
}
getDate=（）=>{
var date=new date（）.toDateString（）；
this.setState（{date}）；
};
render（）{
const{date}=this.state；
返回{date}；
}
}

这里有一个简单的方法：

class App extends React.Component {
  state = {date: new Date()}

  render() {
    return (
      <div class="date">
        <p> ddd {this.state.date.toLocaleDateString()}</p>
      </div>
    );
  }
}

export default App;

类应用程序扩展了React.Component{
状态={date:new date（）}
render（）{
返回(
ddd{this.state.date.toLocaleDateString（）}

);
}
}
导出默认应用程序；

---

干杯

您可以通过使用

${}

使用JavaScript代码，如下所示：

<span className="xyz">
      {`${new Date().toLocaleString()}`}
</span>

{`${new Date（）.toLocaleString（）}`}

请注意，您需要在${}周围使用严重重音字符（即`）

或者，如果要将日期-时间字符串转换为本地值，可以遵循以下解决方案：

<span className="xyz">
      {`${formData.updatedAt ? new Date(formData.updatedAt).toLocaleString() : ""}`}
</span>

{`${formData.updatedAt？新日期（formData.updatedAt）.ToLocalString（）：“”}`}

您的

render（）方法在哪里？如何调用
getDate
函数？您已经使用currentTime创建了一个日期对象，并且正在尝试显示
this.state.date
对象而不显示状态：
©；{new Date（）.getFullYear（）}保留所有权利。
输出：©2020谢谢！如果我理解正确，componentdidmount只是调用getdate函数，对吗？
<span className="xyz">
      {`${new Date().toLocaleString()}`}
</span>

<span className="xyz">
      {`${formData.updatedAt ? new Date(formData.updatedAt).toLocaleString() : ""}`}
</span>