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 状态。

相关推荐
树下水月9 小时前
Typora破解
linux·服务器·前端
用户5508492902569 小时前
CSS布局实战:从Flex到Grid的完整避坑指南
前端
用户5508492902569 小时前
前端接口请求层怎么封装?一个可落地的请求方案
前端
MetWeave9 小时前
跟着一条 SPECI 走流水线:从电报到界面
前端
樱花落木兰10 小时前
分布式登录实战:Session 会话共享改造,Redis 存储用户登录状态
java·javascript·数据库·redis·分布式·缓存
Helix25010 小时前
Chrome 开发者工具进阶:长截图、网络调试与性能分析
前端·chrome·chrome devtools·使用技巧·性能分析·开发者工具·长截图
liangshanbo121510 小时前
面试题:线上 JavaScript 报错如何快速定位到源码?
开发语言·javascript·ecmascript
liangshanbo121510 小时前
面试题:Webpack 的 publicPath 有什么作用?
前端·webpack·node.js
mjhcsp10 小时前
DeepSeek V4.1 Flash 批量处理效能实测
java·前端·数据库
CHEEVEN_QY11 小时前
新能源汽车电池托盘FSW量产的工艺稳定性控制
java·前端·汽车