ionic5回到顶部功能以及改变滚动条位置

ionic5有ion-infinite-scroll组件可以让我们方便的实现移动端的分页查询逻辑（上拉加载更多操作）。可是在列表很长的时候，我们还需要一个可以快速返回列表顶部的功能。下面给大家介绍一下ionic5返回顶部的方法。

1、引入@angular/core模块下面的ViewChild

import { Component, OnInit ,ViewChild} from '@angular/core';

2、引入@ionic/angular模块下面的IonContent

import { NavController,IonContent} from '@ionic/angular';

3、获取ion-content的dom节点对象

export class ProductlistPage implements OnInit {


  @ViewChild(IonContent) content:IonContent;


   constructor(){
   
   }
 

 }

4、ionic5回到顶部 this.content.scrollToTop(0);  

也可以通过this.content.scrollToTop(0);   改变右侧滚动条的位置

  

这就是ionic5回到顶部功能以及改变滚动条位置的使用方法,ionic5回到顶部功能以及改变滚动条位置就给大家先介绍到这里，希望对你有帮助

更多ionic5回到顶部功能以及改变滚动条位置的使用教程：https://www.itying.com/goods-1067.html