微语 微语:代码适合中午敲,早晚出BUG

React创建响应式数据, 并修改 React

1.通过useState进行创建响应式数据,引入useState,

import { useState } from "react"

2.创建好之后,会返回一个数组,下标0就是你的变量,下下标1就是改变内容的方法,改改变内容就需要调用下标1的方法,这里用结构的方式

let [name,setName]=useState('张三')

3.完整代码

import { useState } from "react"

export default function Hello (){
    let [name,setName]=useState('张三')
    let clickBtn=()=>{
        setName('李四')
    }
    return (
        <div>
            <h1>{name}</h1>
            <button onClick={()=>setName('李四')}>修改</button>
            {/* 或者 */}
            <button onClick={clickBtn}>修改</button>
        </div>
    )

}