react中的数据驱动视图,useState()的使用

前端开发如今有一个很重要的思想就是数据驱动视图,数据发生变化使ui发生变化,比如一个变量count,为0显示三个按钮,为1显示一个按钮,为2显示两个按钮。这就是一个简单的数据驱动视图。

复制代码
import { useState } from 'react'



function App() {
  const [count, setCount] = useState(0)
  const handleClick = ()=>{
    setCount(count + 1)
  }

  return (
    <>
     

      <div>react</div>
      <button onClick={handleClick}>{count}</button>      
    </>
  )
}

export default App

这里用到了useState()方法,他返回一个数组,然后我们使用的方式,数组解构,两个参数第一个参数是值,第二个参数是改变第一个参数的值,并且第二个参数是一个方法。

相关推荐
晴天小庭2 分钟前
Sael——基于Jev的AI中转站的安全风控网关,现已开源
人工智能·后端·react.js
炸鸡叔17 分钟前
我做了 BotBus:从手机续聊本地 Agent,查看文件和终端
前端·后端
骑着蜗牛撵大象32720 分钟前
多 Agent 串行流水线:把一个任务拆成可重试、可续跑的 Pipeline 节点链
前端·langchain
2601_9628857237 分钟前
AlphaFeed 支持哪些 K 线周期?period参数怎么传?
前端·数据库·python
OpsEye42 分钟前
兼顾数据安全与成本,私有化 AI 网关正在成为企业标配
javascript·ai编程
企业数字化笔记1 小时前
AI工具的文件和参数怎么设计?上传校验、配置版本与可复现任务
前端·人工智能
铁皮饭盒1 小时前
还是网页端, 46mb模型, 抠图功能升级了, 抠任意主体, 还是不要显卡, 不要python, 满意吗?
前端·javascript·后端
怕浪猫1 小时前
Agent 怎么做规划?这道面试题淘汰了 80% 的候选人
前端·面试·agent
福兮说1 小时前
IP 地址转整数的七个坑:192.168.1.1 算出负数、127.1 也是合法地址、存进 INT 直接溢出
javascript·网络·网络协议·tcp/ip·mysql·golang