importReact, { useState, memo, useCallback, useMemo } from‘react’ functiongetData() { console.log(‘getData被调用了’) letdata = 0 for (leti = 0; i < 999; i++) { data += i } returndata } functionApp() { console.log(‘App组件被渲染了’) const [numState, setNumState] = useState(10) const [ageState, setAgeState] = useState(20) //不希望父组件中的没有变化的数据被渲染,useMemo会返回更多的类型,useCallback返回的是函数 const num = useMemo(() => { return getData() }, []) functionincrement() { setNumState(numState + 10) } return ( <div> <p>num数据: {numState}</p> <p>age数据: {ageState}</p> <buttononClick={() => { increment() }}>修改</button> <p>{num}</p> </div> ) } exportdefaultApp