滚动到当前类别在2.8.0.beta5后损坏

错误
1

在 Discourse 2.8.0.beta5 之前的版本中，如果您编辑一个主题并点击“分类”下拉菜单，当前分类会同时被选中并滚动到列表的顶部，使其立即可见，并且其子分类（如果有）也会显示出来。然后，您可以轻松地将主题移动到更合适的子分类中。

在 2.8.0.beta4 及更早版本中的操作：

从 2.8.0.beta5 开始，打开“分类”下拉菜单时，当前分类不再滚动到可见位置：

希望这些简短的视频演示能帮助您快速了解我所描述的问题。

注意：在我的示例中，“固定分类位置”和“创建时固定分类位置”选项已开启，但无论这些选项开启或关闭，滚动到当前分类的行为都已丢失。

我通过安装 2.8.0.beta4 并观察预期行为，然后更新到 2.8.0.beta5 并观察行为不再奏效，在本地开发中确认了这一点。

我查看了代码，发现涉及 select-kit.js 的以下大范围提交是发生更改的地方（稍等片刻，它应该会跳转到相关代码行）：

从 _scrollToRow() 方法中移除了以下代码，该方法由 _scrollToCurrent() 方法调用：

if (rowContainer) {
  const collectionContainer = rowContainer.parentNode;

  collectionContainer.scrollTop =
    rowContainer.offsetTop - collectionContainer.offsetTop;
}

我确认将这段代码重新添加到 2.8.0.beta5 的 select-kit.js 中可以修复此问题，但由于我不清楚它为何被移除，因此不确定将其添加回来是否会产生其他副作用。

感谢您对此的关注，希望我们能在未来的版本中恢复此行为。

4 个赞
3

您好，感谢您的 :+1:

我不记得我当初为什么这么做，但据我目前所知，我认为这也是个错误。

我创建了这个 PR：

如果您能尝试运行这段代码，并告诉我您认为这是否足够，请告诉我？

4

你好 Joffrey，感谢你查看这个！我测试了最新的更改，但似乎没有奏效。由于它已被合并，我在 tests-passed 分支上进行了确认。

在 PR 中的两个提交中，第一个是有效的（ab0fbf1），但被第二个（92943ff）覆盖了。

第 992 行 的更改看起来不错，但没有达到预期的效果。它似乎需要调整 collectionContainer.scrollTop 值的已删除代码块。

再次感谢！

1 个赞
5

是的，我不确定这种行为是否足够。我明天可以把它加回来。您能更具体地说明一下您现在不喜欢这种行为的哪些方面吗？

6

您好 Joffrey，

感谢您继续对此进行研究。通过当前的的代码更改（我已确保拉取了最新代码、清除了 tmp 并重启了开发服务器），它并未恢复 2.8.0.beta5 之前的版本中存在的行为。它仍然不再滚动以显示下拉列表中可见选项顶部的当前类别。

正确/期望的行为如原始帖子中的第一个视频所示，但目前仍然如第二个视频所示工作。当前滚动条始终从顶部开始，无论当前类别在选项中的哪个位置。

rowContainer?.focus({ preventScroll }); 这一行似乎在这种情况下不起作用，无论 preventScroll 是 true、false，甚至是完全移除该行。

使行为生效的关键行（当前版本中不存在）是：

collectionContainer.scrollTop =
          rowContainer.offsetTop - collectionContainer.offsetTop;

没有这一行，它不会滚动到正确的位置，因为 scrollTop 默认为 0。运行此行后，scrollTop 等于它需要向下滚动的正确像素数。

希望这对您有所帮助。如果您需要进一步的澄清，请告诉我。

谢谢！

7

是的，它不在顶部，但它在视口内，我认为这就足够了。

8

嗨 Joffrey，

感谢您的反馈。我为我的演示添加了更多类别，并确认当前类别现在确实出现在视口中，这无疑是一个改进。但理想情况下，它仍应出现在列表的顶部，就像以前一样。这样可以确保它下面的更多子类别立即可见，用户无需向下滚动即可显示它们，从而点击切换到子类别。在我看来，这比显示相邻的不相关类别更有用。它是特意更改为居中的，还是之前行为的意外回归？无论如何，由您决定——我只是提供我的建议。

再次感谢，我非常感谢您在 Discourse 上付出的辛勤努力！