面试 - react Hooks - useState

import React from "react";

//-----------------类组件----this.state---this.setState({})-----------
//  class Count extends react.Component {
//   state = {
//     count: 1,
//   };
//   add = () => {
//     // this.setState({count:this.state.count+1});//对象写法（语法糖）
//     this.setState((state, props) => ({ count: state.count + 1 })); //函数写法------当新值依赖旧值时，用函数比较好
//   };
//   render() {
//     return (
//       <div>
//         <div>count是{this.state.count}</div>
//         <button onClick={this.add}>点我+1</button>
//       </div>
//     );
//   }
// }

//---------------函数式组件（无状态，无this）---const [count,setCount]=useState()-----Hooks-----------

export default function Count() {
  const [count, setCount] = React.useState(0);
  const add = () => {
    setCount(count + 1); //新值覆盖旧值
    // setCount((count) => count + 1); //函数写法------当新值依赖旧值时，用函数比较好
  };
  return (
    <div>
      <div>count是{count}</div>
      <button onClick={add}>点我+1</button>
    </div>
  );
}