1.使用useMemo前展示
import { useState,useMemo } from "react"
function kanno(num){
console.log(999,num);
return ++num
}
function UseMemo(){
const [count1,setCount1] = useState(0)
const [count2,setCount2] = useState(0)
const result = kanno(count1)
console.log(666);
return (
<div>
<button onClick={()=>setCount1(count1+1)}>count1:{count1}</button>
{result}
<button onClick={()=>setCount2(count2+1)}>count2:{count2}</button>
</div>
)
}
export default UseMemo
2.使用useMemo后展示
import { useState,useMemo } from "react"
function kanno(num){
console.log(999,num);
return ++num
}
function UseMemo(){
const [count1,setCount1] = useState(0)
const [count2,setCount2] = useState(0)
const result = useMemo(()=>{
return kanno(count1)
},[count1])
console.log(666);
return (
<div>
<button onClick={()=>setCount1(count1+1)}>count1:{count1}</button>
{result}
<button onClick={()=>setCount2(count2+1)}>count2:{count2}</button>
</div>
)
}
export default UseMemo