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

相关推荐
RANxy几秒前
AntV 入门系列:G6 图可视化实战
前端
尽欢i2 分钟前
Vue3 customRef 封神教程:防抖、本地存储、自动埋点一套搞定,模板干干净净
前端·javascript·vue.js
VOLUN5 分钟前
TypeScript封装通用RESTful BaseAPI,后台接口代码精简80%
前端·javascript
胡永双5 分钟前
Hexo + GitHub Pages搭建个人Blog教程(三)
前端
hunterandroid7 分钟前
[Android 从零到一] 权限管理:运行时权限与最佳实践
前端
kyrie2810 分钟前
Redux 完整基础操作(原生 Redux,不结合 React-Redux)
前端
因_崔斯汀10 分钟前
Vue 模板编译:HTML 是怎么变成 JS 的?
前端·vue.js
UXbot23 分钟前
帮助企业低门槛开展AI应用开发的平台推荐
前端·低代码·ui·交互·产品经理·原型模式·web app
橘子星1 小时前
基于 Vite 的多模态生图前端工程实践
前端·javascript·人工智能