使用useState和useEffect的基本示例是什么

發(fā)布時(shí)間：2024-06-29 13:21:46 來源：億速云閱讀：89 作者：小樊欄目：web開發(fā)

useState和useEffect是React Hooks的兩個(gè)常用API，用于在函數(shù)組件中管理狀態(tài)和處理副作用。

下面是一個(gè)基本示例，展示了如何使用useState和useEffect：

import React, { useState, useEffect } from 'react';

const ExampleComponent = () => {
  const [count, setCount] = useState(0);

  useEffect(() => {
    document.title = `You clicked ${count} times`;
  }, [count]);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
};

export default ExampleComponent;

在上面的示例中，useState用于創(chuàng)建一個(gè)名為count的狀態(tài)變量，并使用setCount函數(shù)來更新該狀態(tài)。每次點(diǎn)擊按鈕時(shí)，count會增加1。

useEffect用于在組件渲染時(shí)執(zhí)行副作用操作。在這個(gè)例子中，我們使用useEffect來更新瀏覽器標(biāo)題，每當(dāng)count更改時(shí)，useEffect會重新運(yùn)行。

向AI問一下細(xì)節(jié)

使用useState和useEffect的基本示例是什么

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽