在 React 开发中,开启 StrictMode 组件后,它会对应用产生哪些具体影响?请说明其设计目的和常见使用场景。
考察说明
考查对 React 严格模式核心功能及其开发阶段限制的理解。
回答思路
- 【回答框架 1】严格模式是 React 内置的开发模式,主要帮助发现潜在问题。它不会渲染任何可见 UI,仅在开发模式下启用。
- 【回答框架 2】其主要作用包括:识别不安全的生命周期方法,例如 UNSAFE_componentWillMount 等;检测意外的副作用,通过双调用某些函数(如渲染函数、setState 更新函数)来暴露副作用依赖;提示遗留的 findDOMNode 用法;检测过时的 context API 用法。
- 【回答框架 3】双调用机制在开发模式下生效,生产环境无影响,且严格模式向下兼容。
- 【回答框架 4】使用方式:将 <React.StrictMode> 包裹在应用或组件树外部即可,例如根组件。
- 【关键点 1】严格模式只在开发环境生效,不产生生产环境额外开销。
- 【关键点 2】主要功能包括检测不安全生命周期、副作用、findDOMNode 和旧版 context API。
- 【关键点 3】通过刻意双调用渲染函数等函数来暴露副作用,但不保证所有副作用被检测到。
- 【易错点 1】严格模式不能完全替代代码审查,部分副作用可能无法被检测。
- 【易错点 2】双调用可能干扰依赖外部变量的代码,调试时需注意。
- 【易错点 3】不要在生产环境使用严格模式,以免造成困惑或额外检查。