react 中的Hook

Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。

import React, { useState, useEffect } from 'react';

export default function UseState() {
  // useState是一个方法，参数是默认值， 可以让函数组件中拥有state
  //从useState解构出来是一个数组， count 是初始值变量，setCount 是更改count的函数，0 是初始值；
  let [count, setCount] = useState(0);
  // useEffect 的参数是一个回调，不管是组件挂载还是更新都会触发这个回调函数，
  // 类似于componentDidMount 和 componentDidUpdate，有数据更改，则执行该函数
  useEffect(() => {
    document.title = '我是标题' + count;
  })
  return (
    <div>
      <button onClick={() => { setCount(--count) }}>-</button>
      <span>{count}</span>
      <button onClick={() => {setCount(++count)}}>+</button>
    </div>
  );
}