请说明useState 主要传参方式 ?
参考答案:
useState 是 React 的一个内建 Hook,它用于在函数组件中添加本地状态。它接收一个初始状态值作为参数,并返回一个数组,该数组包含两个元素:当前状态和设置当前状态的函数。
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>
);
}
在这个例子中,useState(0) 创建了一个名为 count 的状态变量,初始值为 0。同时,useState 还返回了一个函数 setCount,可以用来更新 count 的值。
useState 的返回值是一个数组,可以通过解构赋值的方式获取状态变量和设置状态的函数。在上面的例子中,count 是状态变量,setCount 是设置状态的函数。
需要注意的是,useState 的初始状态值只会在组件首次渲染时使用。之后,状态值将通过调用设置状态的函数(如 setCount)进行更新。
除了初始状态值外,useState 不需要其他参数。如果你需要在组件中管理多个状态,可以多次调用 useState,每次都会返回一个新的状态变量和设置状态的函数。例如:
const [count, setCount] = useState(0);
const [name, setName] = useState('Alice');
在这个例子中,useState 被调用了两次,创建了两个独立的状态变量 count 和 name,以及对应的设置状态的函数 setCount 和 setName。