Ionic v5滚动到顶部

Posted 2023-02-24

Current environment:
    Ionic CLI                     : 6.7.0
    Ionic Framework               : @ionic/angular 5.1.0
    @angular-devkit/build-angular : 0.803.26
    @angular-devkit/schematics    : 8.3.26
    @angular/cli                  : 8.3.26
    @ionic/angular-toolkit        : 2.2.0

ionic v5的文档让我毫无头绪。我尚未克服我认为的学习曲线。

如何创建带有浮动操作按钮的顶部滚动按钮？我一直在Content Docs页面上尝试查找所需的信息。因此，我认为我需要获得对打字稿文件中内容的引用。我习惯了JS，在这种情况下，它就像document.getElementById()一样简单。快速的Google搜索将我带到了V3 Framework docs。它明确指出To get a reference to the content component from a Page's logic, you can use Angular's @ViewChild annotation:，这绝对是太好了。谢谢。但是我现在使用的是V5，而不是V3，它们的区别足以使所有内容中断。

所以我感觉还不错，也许我只是个白痴，无能为力。 向下滚动到方法 getScrollElement和scrollToTop咕咕……我从这份文件中什么也没得到。

总而言之，我有两个问题。如何在v5中执行此操作，或者您可以向我展示一个以更好的方式概述它的文档？我疯了吗？也许这是一个角度问题，而不是一个离子问题。

答案

这是离子性挑战。

您有两个选择

1）使用标准的离子方式正确实现滚动到顶部，如in the framework documentation forum.所述>

2）您可以找到您的元素并以编程方式对其进行滚动。

document.querySelector('app-your-component-name').querySelector('ion-content').scrollToTop();

注意：如果您有能力发表您到目前为止所尝试的内容，将有助于您提供更准确的答案。