1. ホーム
  2. javascript

[解決済み] React.jsでstateを使用して日付を表示するには?

2022-03-13 12:56:17

質問

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;

解決方法は?

最初に明示的に設定することなく、日付の状態を取得しようとしている。 のようなものでメソッドを実行します。 コンポーネントディマウント :

getDate()

そこから、レンダリングコールでそれを受け取ることができるはずです。

class App extends App.Component {
  ...
  componentDidMount() {
    this.getDate();
  }
  ...
}

更新しました。

コンストラクタ() は、データを取得するために外部からのリクエストを呼び出さないので、この状況により適していると思われます。

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