框架互操作

共 20 题
#

1. 不同框架共存时的 DOM 所有权,为什么 React/Vue 各自管理节点会冲突?

A 多个框架可安全管理同一 DOM 子树
B 跨框架通信无需隔离边界
C 虚拟 DOM diff 不会覆盖外部节点
D 冲突源于框架对 DOM 子树的独占管理 ✓ 正确答案
#

2. React 并发渲染下对外部框架管理 DOM 子树的更新时序,useSyncExternalStore 接入与批量更新边界

A 它用于在 render 中直接修改外部 DOM
B 它订阅外部可变状态并同步触发 React 更新 ✓ 正确答案
C 它只适用于同步状态
D 它与并发渲染无关
#

3. React 中挂载 Vue 组件,两个响应式系统的协调?

A 两套响应式系统可直接共享同一状态
B 两者可同时管理同一 DOM 子树
C Vue 的响应式状态可直接用于 React render
D 需通过 ref/effect 协调挂载与卸载 ✓ 正确答案
#

4. 自定义元素的 attribute 与 property 反射,observedAttributes/attributeChangedCallback 在框架 props 同步中的边界,以及 property 优先的现代实践?

A property 优先用于传递复杂对象与数组 ✓ 正确答案
B attribute 能表达任意复杂类型
C observedAttributes 监听 property 变化
D attribute 与 property 完全等同
#

5. Lit 框架(LitElement、reactive properties、html 模板、css tagged templates、内置指令)

A reactive properties 变化不会触发更新
B css 标签模板用于定义 JS 逻辑
C html 标签模板基于 template literal 创建模板 ✓ 正确答案
D Lit 组件不能跨框架复用
#

6. template 与 HTML 字符串解析在自定义元素 SSR 的工程价值

A <template> 内容会被立即渲染
B 字符串解析无需考虑 XSS 转义
C document.importNode 可克隆 template 内容复用 ✓ 正确答案
D template 无法用于 SSR
#

7. React 19 / Vue 3 自定义元素集成与 prop/event/slot 互操作的工程取舍

A 自定义元素无法跨框架复用
B Vue 3 无法使用自定义元素
C React 19 不支持 slot
D React 19 原生支持自定义元素与 composed 事件 ✓ 正确答案
#

8. Stencil 的 lazy-load 输出目标与 Stencil Angular/Vue 集成

A Stencil 无法生成 Angular/Vue 包装器
B lazy-load 让组件按需加载,减少首屏体积 ✓ 正确答案
C Stencil 组件必须依赖特定框架
D lazy-load 总是加载全部组件
#

9. Stencil(装饰器组件、JSX 渲染、分布式组件、SSR 支持)

A Stencil 组件强制依赖 Angular
B Stencil 用装饰器与 JSX 声明组件 ✓ 正确答案
C Stencil 不支持 SSR
D Stencil 是运行时渲染框架
#

10. HTML Templates(<template>、document.importNode)的克隆机制

A cloneNode(true) 得到独立且可复用的节点副本 ✓ 正确答案
B <template> 内容会被立即渲染
C 模板克隆会共享原内容而非复制
D 模板无法用于列表渲染
#

11. Lit Element 与 React/Vue 在大型项目的工程取舍

A Lit 适合跨框架复用的组件库 ✓ 正确答案
B React/Vue 组件可跨框架直接复用
C Lit 提供完整应用路由与状态管理
D 大型项目只能二选一
#

12. 微前端中框架互操作,自定义元素作为隔离边界?

A 自定义元素可完全隔离 JS 全局
B 微前端只能使用 iframe
C 自定义元素能隔离样式而不影响事件
D 自定义元素对框架中立,便于跨框架组件互操作 ✓ 正确答案
#

13. 同一原生表单元素被 React 受控 value 与 Vue v-model 同时管理时的值拉锯与更新顺序治理

A 值拉锯源于两个响应式系统同时回写同一 DOM ✓ 正确答案
B 两套系统可安全共享同一表单值
C v-model 与受控 value 不会冲突
D 更新顺序不会影响结果
#

14. Angular @angular/elements(createCustomElement)包装组件与 zone.js 变更检测、事件导出的互操作边界

A zone.js 变更检测与外部事件无关
B createCustomElement 把 Angular 组件包装为标准自定义元素 ✓ 正确答案
C 事件导出无需显式声明
D 属性总是以对象形式传递
#

15. 框架间通信,事件总线、全局状态与 postMessage?

A postMessage 无法跨源
B 事件总线适合同步读取大块数据
C 全局状态无需命名约定
D postMessage 用于跨窗口/iframe 通信 ✓ 正确答案
#

16. 混合渲染,React 中嵌入 Vue 组件时的生命周期协调?

A Vue 可以在 React 渲染外直接操作同一 DOM
B React 的 cleanup 对应 Vue 的 unmount ✓ 正确答案
C 无需管理 Vue 的卸载
D React effect 与 Vue mount 无关
#

17. 框架互操作的常见陷阱,事件绑定与卸载?

A 卸载时无需清理监听器
B 重复渲染可能造成同名监听累积 ✓ 正确答案
C 跨框架事件无需 composed 即可冒泡
D 事件绑定时机不影响监听是否生效
#

18. React/Vue 混合渲染的卸载顺序与内存泄漏?

A 未清理的定时器与订阅是常见泄漏来源 ✓ 正确答案
B 子框架的卸载无需在父框架清理前完成
C 事件监听无需用后移除
D 卸载顺序不影响内存安全
#

19. CustomEvent 分发与 composed/bubbles 标志,React 合成事件与原生自定义元素事件互操作时的监听与冒泡边界?

A 自定义元素事件需 composed: true 才能被 React 根容器捕获 ✓ 正确答案
B React 合成事件监听捕获阶段的原生事件
C composed 标志不影响事件跨 Shadow 边界
D 自定义元素事件无需 bubbles 即可被 React 监听
#

20. Svelte 组件编译为自定义元素(customElement 选项)时 props、事件导出与 SSR 的限制

A SSR 与自定义元素编译使用同一配置
B 事件会自动导出无需 dispatch
C props 的 attribute 反射只支持字符串 ✓ 正确答案
D 复杂对象属性可直接反射到 attribute