15、React Hooks：函数组件的状态与生命周期管理

React Hooks：函数组件的状态与生命周期管理

1. 函数组件的生命周期

函数组件的生命周期比类组件简单得多。以下是一个简单的函数组件示例：

const App = (props) => {
  return <h1>Function Component</h1>;
};
export default App;

在 React 中，通过调用 App(props) 来渲染这个函数组件。如果未指定任何 props ，参数将为空。若需要重新渲染该组件，React 会再次调用 App(props) 。但函数组件没有像类组件那样的生命周期事件，因此无法管理状态。

为了探究函数组件的能力，我们重新设计 App 和 Time 组件。具体操作步骤如下：
1. 创建一个新的 React 沙箱，或者更新现有沙箱中的代码。在弹出窗口中选择 React，默认会创建 App.js 文件。
2. 创建 Time.js 文件，并复制以下代码到其中：

let currentTime = new Date().toLocaleString();
const Time =(props) => {
  return <h1>{currentTi