前端/移动开发面试题更新 2026-08-05

请解释React中业务组件与技术组件的概念,并阐述两者之间的主要区别。

前端/移动开发技术原理方案权衡React

考察说明

考察对React组件分类及职责划分的理解。

回答思路

  1. 【回答框架 1】业务组件:直接与业务逻辑耦合,通常包含数据请求、状态管理及用户交互逻辑,如订单列表组件。技术组件:不关心具体业务,专注于可复用的UI展示或通用交互,如按钮、输入框、通用弹窗。
  2. 【回答框架 2】区别:业务组件依赖具体业务上下文,复用性低,通常针对特定页面或功能;技术组件与业务解耦,追求高复用性,通过props或children定制。
  3. 【回答框架 3】边界:技术组件可以组合成业务组件,也支持嵌套;业务组件可能包含多个技术组件,但技术组件不应包含业务逻辑。
  4. 【回答框架 4】实践:推荐将两者分离,技术组件下沉到底层,业务组件组装,便于维护和测试。
  5. 【关键点 1】业务组件包含业务逻辑,技术组件只负责通用UI。
  6. 【关键点 2】技术组件具有高复用性,业务组件复用性低。
  7. 【关键点 3】技术组件通过props接口与外界通信,业务组件直接调用业务API。
  8. 【易错点 1】在技术组件中混入业务逻辑,导致复用困难。
  9. 【易错点 2】过度拆分导致组件通信频繁,性能下降。