react crash course 2024(5) useState钩子

使用 数组解构 来命名状态变量,例如 [something, setSomething]

复制代码
import { useState } from 'react';
const [showFullDescription,setShowFullDescription] = useState(false) //设置默认值为false

react的事件

点击事件 οnclick={}

改变状态的setSomething函数用法

复制代码
 {/* 在set函数中直接传递值setShowFullDescription */}
  <button onClick={()=> setShowFullDescription(!showFullDescription)} className="text-indigo-500 mb-5 hover:text-indigo-600">
  {showFullDescription ? 'Less' :'More'}
 </button>

{/* 通过传递函数来改变状态 */}
 <button onClick={()=> setShowFullDescription((prevState)=>!prevState)} className="text-indigo-500 mb-5 hover:text-indigo-600">
  {showFullDescription ? 'Less' :'More'}
 </button>
相关推荐
hepherd13 分钟前
Flask学习笔记 - 模板渲染
前端·flask
LaoZhangAI13 分钟前
【2025最新】Manus邀请码免费获取完全指南:5种稳定渠道+3个隐藏方法
前端
经常见15 分钟前
浅拷贝与深拷贝
前端
梅子酱~19 分钟前
Vue 学习随笔系列二十二 —— 表格高度自适应
javascript·vue.js·学习
前端飞天猪20 分钟前
学习笔记:三行命令,免费申请https加密证书📃
前端
关二哥拉二胡21 分钟前
前端的 AI 应用开发系列二:手把手揭秘 RAG
前端·面试
斯~内克23 分钟前
前端图片加载性能优化全攻略:并发限制、预加载、懒加载与错误恢复策略
前端·性能优化
你的人类朋友24 分钟前
JS严格模式,启动!
javascript·后端·node.js
奇怪的知识又增长了32 分钟前
Command SwiftCompile failed with a nonzero exit code Command SwiftGeneratePch em
前端
Maofu32 分钟前
从React项目 迁移到 Solid项目的踩坑记录
前端