1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【初心者】Reactのstateについて

Posted at

stateについて

Reactのstate(ステート)は、コンポーネントの現在の状態を保持するために使用されるデータ。

Reactのコンポーネントは関数またはクラスの形で書くことができる。どちらの場合でもstateを使ってデータを管理できる。
※関数コンポーネントは、useStateフックを使用してstateを管理する。React 16.8で導入された機能。

関数コンポーネントの書き方について

※今回は関数コンポーネントについて整理する。

import React, { useState } from 'react';

function MyComponent() {
  const [count, setCount] = useState(0); // 初期stateを設定

  const incrementCount = () => {
    setCount(count + 1);
  };

  return (
    <div>
      <p>{count}</p>
      <button onClick={incrementCount}>Increment</button>
    </div>
  );
}

この例では、useStateフックを使用。
countという名前のstate変数を作成し、それを更新するための関数setCountを作成している。
useStateの引数には、stateの初期値(この場合は0)を渡している。
ボタンがクリックされると、incrementCount関数が呼び出され、setCountを通じてcountの値が更新される。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?