React-useState的使用

原创已于 2024-11-26 17:12:35 修改 · 518 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#react.js #javascript #前端

于 2024-11-26 17:12:20 首次发布

useState 是 React 提供的一个 Hook，允许你在函数组件中添加和管理状态（state）。在类组件中，状态管理通常是通过 this.state 和 this.setState 来实现的，而在函数组件中，useState 提供了类似的功能。

基本用法:

useState 接收一个初始状态值，并返回一个数组，包含两个元素：当前状态和一个允许你更新该状态的函数。

示例代码

import React, { useState } from 'react';

function Example() {
  // 声明一个名为 "count" 的状态变量，初始值为 0
  const [count, setCount] = useState(0);

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