react

Posted 2022-09-23 马如林

react antd pro

 

import React,  useState  from 'react'



function Child( onButtonClick, data ) 

console.log('Child Render', data)

return (

<button onClick=onButtonClick>data.name</button>

)





const AddCount = () => 

// const [ count, setCount ] = useState(0)

const [count, setCount] = useState(() => 

return 11;



)

const [number, setNumber] = useState(0)

const [name, setName] = useState('hello') // 表单的值

const data =  number, name 



const addcount = () => 

let newCount = count

setCount(newCount += 1)





function handleClick() 

setCount(count + 2)





function handleClickFn() 

setCount((prevCount) => 

return prevCount + 3

)





function handleClickFn2() 

console.log("test")

setTimeout(() => 

setCount((prevCount) => 

return prevCount + 1

)

, 3000);





const addClick = () => setNumber(number + 1)



return (

<div>

<p>count</p>

<button onClick=addcount>count++</button>

<button onClick=handleClick>count2++</button>

<button onClick=handleClickFn>count3++</button>

<button onClick=handleClickFn2>countf++</button>



<input type="text" value=name onChange=e => setName(e.target.value) />

<Child onButtonClick=addClick data=data />

</div>

)



export default AddCount