React技术点教程 – 案例分析
本文将详细介绍React的一个技术点，并辅以案例讲解。
React Hooks 之 useEffect 钩子
React Hooks 是 React 16.8 版本引入的一项新功能，允许我们在不写类的情况下使用 state 和其他 React 特性。其中，useEffect 钩子用于处理副作用。
一、useEffect 基本用法
useEffect 接受一个函数作为参数，该函数会在组件挂载后立即执行。它可以用来处理一些组件初始化时的操作。
二、案例分析：计数器应用
假设我们要创建一个简单的计数器应用，当页面加载时自动增加计数，并在计数变化时显示一条消息。
import React, { useState, useEffect } from 'react';
function Counter() {
const [count, setCount] = useState(0);
const [message, setMessage] = useState('');
useEffect(() => {
// 当组件加载时执行的代码
// 例如，设置初始计数和消息提示
setCount(1); // 初始化计数为 1
setMessage('计数已更新'); // 设置初始消息提示内容
}); // 不需要传入依赖数组，表示这个副作用在每次渲染后都会执行一次。如果传入数组（例如：[count]），则表示仅在 count 变化时执行此副作用。
在这个例子中，我们使用了 useEffect 来初始化计数和设置消息提示内容。每次组件加载时，都会执行 useEffect 中的代码。
