react项目实战学习笔记-学习3-知识点回顾3

简介: react项目实战学习笔记-学习3-知识点回顾3

类组件

import React,{Component, Fragment, useState} from "react"
class App extends Component{
    state={
        num:1
    }
    onClick=()=>{
        this.setState({
            num:this.state.number+1
        })
    }
    render(){
        return (
            <>
            <h1>{this.state.number}</h1>
            <button onClick={this.onClick.bind(this)}></button>
            </>
        )
    }
}
export default App

函数组件

import React,{Component, Fragment, useState} from "react"
function App(){
  const [num,setNum]=useState(1)
  const addNum=()=>{
    setNum((num)=>num+1)
  }
  return(
    <>
    <h1>数字为:{this.state.num}</h1>
    <button onClick={{addNum}}>累加</button>
    </>
  )
}
export default App

useRef获取到子组件

相关文章
|
1天前
|
前端开发
react学习(17)回调形式的ref
react学习(17)回调形式的ref
|
1天前
|
前端开发
react学习(15)函数式组件中使用props
react学习(15)函数式组件中使用props
|
1天前
|
前端开发 JavaScript
react学习(13)props
react学习(13)props
|
1天前
|
存储 前端开发 容器
react学习(18)createRef形式的ref
react学习(18)createRef形式的ref
|
1天前
|
前端开发
react学习(14)类式组件的构造器与props
react学习(14)类式组件的构造器与props
|
5天前
|
前端开发 JavaScript 中间件
react学习(11)
react学习(11)
|
5天前
|
前端开发 JavaScript
react学习(10)
react学习(10)
|
6天前
|
前端开发 JavaScript
react学习(8)
react学习(8)
|
6天前
|
前端开发
react学习(9)
react学习(9)
|
5天前
|
前端开发
react学习(12)
react学习(12)