//性能优化一点,极少成多,网页会成为大厂所青睐的网页
//如下一个hooks函数
import React,{useState} from 'react'; // import TodoList from './TodoList'; function App() { let a=1; console.log(1) //可以看到数据更新,就执行一次,上面的let a 也执行,数据较多时损耗性能。 const [b,setb]=useState(a); //hooks解构赋值 return ( <div className="App"> {b} <button onClick={()=>{setb(b+1)}}></button> </div> ); } export default App;
//可以采用如下方式
import React,{useState} from 'react'; // import TodoList from './TodoList'; function App() { // console.log(1) const [b,setb]=useState(()=>{ let a=1; console.log(a); //可以看到采用这种方式,数据只在第一次初始化,当数据较多时,节省性能。 return a; }); return ( <div className="App"> {b} <button onClick={()=>{setb(b+1)}}></button> </div> ); } export default App;