//性能優化一點,極少成多,網頁會成為大廠所青睞的網頁
//如下一個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;