useState 是一个 React Hook,它允许您通过返回包含两个变量的数组来向组件添加状态:state、setState。当前状态以及调用时成为 setter 函数的函数。它可用于跟踪应用程序中需要跟踪的数据或属性,例如字符串、数字、布尔值、数组或对象。
示例:
const [state, setState] = useState();
简单来说,状态会在任何时候发生变化并且需要更新,因此“setState”将更新状态,随着时间的推移触发组件的重新渲染。
此外,useState 可以保存任何类型的 Javascript 值,包括对象。始终记住的一点是,您永远不应该直接更改处于 React 状态的对象。首先,您需要创建一个新副本或创建现有副本的副本,然后将 State 设置为新副本。例如:
// Objects const [state, setState] = useState({name: 'Marlo', age: 56}); const updateName = () => { setState({...state, name: 'Karlo'}); }; const updateAge = () => { setState({...state, age: 96}); }; --------------------------------------------------------------------------------- // Arrays const [array, setArray] = useState([1, 2, 3, 4, 5]); const addItem = () => { setArray([...array, 6]); }; const removeItem = () => { setArray(array.slice(0, array.length - 1)); };
要在 React 组件中使用 useState,首先需要从 React 导入它,方法是在组件页面顶部以两种不同的方式编写以下代码,两种方式都可以完美地让你可以选择你的毒药。
import React from 'react'; import {useState} from 'react';
或者你可以写一行
import React, {useState} from 'react';
React Hook useState 可以在组件的顶层或自定义钩子内调用,但不能在循环或条件内调用。
const [initialState, setInitialState] = useState();
initialState 仅在初始渲染期间使用,在后续渲染中将被忽略。
以上是{useState} HooK { 简要解释};的详细内容。更多信息请关注PHP中文网其他相关文章!