React useState基本类型变量的使用

在 React 中,useState 是一个 Hook,用于在函数组件中添加状态,它可以让函数组件拥有状态。基本使用方法如下:

js 复制代码
// App.jsx
import React, { useState } from 'react'
 
function App() {
  // 使用 useState 创建一个状态变量,初始值为基本类型(比如字符串)
  const [text, setText] = useState('React useState')
 
  // 更新状态的函数
  function handleChange(event) {
    setText(event.target.value)
  }
 
  return (
    <div>
      <input type="text" value={ text } onChange={ handleChange } />
      <p>{ text }</p>
    </div>
  )
}

在这个例子中,text 是一个基本类型变量,初始值为字符串 'React useState'。setText 函数用于更新这个状态变量。当输入框的内容变化时,handleChange 函数会被调用,并用新的值更新 text 状态。

相关推荐
龙亘川1 小时前
健康服务规范化背后,数字化如何 “辅助赋能“
大数据·前端·人工智能·智慧城市·数据可视化
data analyse 4561 小时前
SourceMap 上传版本与报错版本对不上?版本校验与错误还原设计
大数据·前端·人工智能·数据分析
前端双越老师2 小时前
程序员 1v1 访谈系列第三期:先不要想在工作中有突破
前端·ai编程·全栈
浮生望2 小时前
从作用域链到 React 陈旧闭包:为什么函数式更新能拿到最新 state
javascript
小羊没烦恼!2 小时前
浅谈SQL Server中的事务日志(二)----事务日志在修改数据时的角色
前端·数据库·后端·python·web安全·oracle
myaifas2 小时前
新人的第一个任务该怎么选
前端·产品经理
怕浪猫2 小时前
前端转全栈最低成本的技术栈选择
前端·javascript·面试
狂师2 小时前
AI时代我们要如何玩抓包测试:Reqable + AI Agent
前端·程序员·测试
data analyse 4562 小时前
页面卸载时埋点上报总丢失?sendBeacon 上报与补偿方案
大数据·运维·服务器·前端·数据库·人工智能·数据分析
WebInfra2 小时前
Rsdoctor 2.0 发布:Agent 驱动的全自动优化工具
前端·javascript·node.js