react如何重新渲染
React 重新渲染的机制
React 的重新渲染是由状态（state）或属性（props）的变化触发的。当组件的数据发生变化时，React 会自动比较虚拟 DOM 并决定是否需要更新真实 DOM。
触发重新渲染的方法
修改组件的 state
通过 useState 或 this.setState 更新状态会触发重新渲染。例如：
const [count, setCount] = useState(0);
setCount(count + 1); // 触发重新渲染修改组件的 props 父组件传递的 props 发生变化时，子组件会重新渲染。例如：
<ChildComponent newProp={updatedValue} />使用 forceUpdate（不推荐）
类组件中可以通过 this.forceUpdate() 强制重新渲染，但应尽量避免使用，因为它违背了 React 的数据驱动原则。
优化重新渲染
使用 React.memo 对函数组件进行浅比较，避免不必要的渲染：
const MemoizedComponent = React.memo(MyComponent);使用 useCallback 和 useMemo 缓存函数和计算值，避免依赖项未变化时的重复渲染：
const memoizedCallback = useCallback(() => doSomething(a, b), [a, b]);
const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);shouldComponentUpdate（类组件） 通过自定义比较逻辑控制是否渲染：
shouldComponentUpdate(nextProps, nextState) {
return nextProps.id !== this.props.id;
}常见问题
不必要的渲染 检查是否在渲染函数中进行了状态更新或产生了副作用，这可能导致无限循环。
深度嵌套数据更新
对于复杂对象或数组，确保使用不可变更新方式（如展开运算符或 immer 库）以正确触发渲染。
