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

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

react的事件点击事件 οnclick={}

改变状态的setSomething函数用法

useState

 {/* 在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>

不写成

onClick={setShowFullDescription(!showFullDescription)}

是因为useState 钩子的更新函数（例如 setShowFullDescription）需要以函数的形式被调用，而不是直接调用。

如果你直接插入一个布尔值（例如 {testio}），React 会将其视为无效内容，不会在页面上显示任何东西。这是因为布尔值不是有效的 React 渲染输出。