SurveyJS库中questionPerPage模式的分页行为变更解析

背景介绍

SurveyJS是一个流行的开源问卷调查库，它提供了灵活的问卷构建和展示功能。在1.12.16版本中，该库对questionsOnPageMode设置为questionPerPage时的分页行为进行了重要变更，这影响了开发者对问卷进度跟踪的实现方式。

行为变更详情

在1.12.15及之前版本中，当启用questionPerPage模式时，SurveyJS会重新构建问卷的分页结构，使得每个问题都成为一个独立的逻辑页面。这意味着：

1. pageCount属性返回的是实际展示的页面总数（通常等于问卷问题数量）
2. onCurrentPageChanged事件中的页面索引会随着每个问题的切换而改变

而在1.12.16版本中，这一行为发生了根本性变化：

1. 库不再重构原始页面结构，而是保持问卷定义中的原始分页
2. pageCount返回的是问卷定义中的页面数量
3. 页面索引只在跨越原始定义中的页面边界时才会变化
4. 通过隐藏非当前问题的方式实现"每题一页"的视觉效果

技术实现差异

旧版本实现方式：

• 运行时动态重建页面结构
• 为每个问题创建独立的逻辑页面
• 每次导航都触发页面变更事件

新版本实现方式：

• 保持原始页面结构不变
• 使用CSS和DOM操作隐藏非当前问题
• 仅在实际切换原始页面时触发页面变更事件

开发者适配建议

对于需要跟踪用户答题进度的开发者，可以采用以下替代方案：

1. 使用survey.currentSingleElement属性获取当前显示的问题
2. 通过问卷的visibleQuestions集合计算当前问题位置
3. 监听问题值变化事件而非页面变化事件

性能考量

这一变更的主要优势在于性能提升：

• 避免了动态重建页面结构的开销
• 减少了不必要的DOM操作
• 特别有利于包含大量问题的问卷

总结

SurveyJS 1.12.16版本对questionPerPage模式的优化是一个积极的改进，虽然需要开发者调整部分实现逻辑，但带来了显著的性能提升和更稳定的行为表现。理解这一变更背后的设计理念，有助于开发者更好地利用SurveyJS构建高效、流畅的问卷调查应用。