Ionic 4 平滑滚动到锚点答案

【问题标题】：Ionic 4 smooth scroll to anchorIonic 4 平滑滚动到锚点
【发布时间】：2019-05-05 00:36:09
【问题描述】：

我只有一个登录页面，其中包含一个菜单和一些部分。菜单中的每个项目都应平滑滚动到给定部分。

我的第一个方法是：

window.scrollTo({
  y: this.el.nativeElement.querySelector('app-contact').offsetTop // 600
  behavior: 'smooth'
});

我遇到的问题：

Ionic 4 似乎没有响应scrollTo 即使我写window.scrollTo(0, 300)，也不会发生任何事情。
behavior: 'smooth' 并非在每个浏览器中都支持。因此，我不能使用这种方法。

我想知道如何使用 Ionic 4 实现平滑滚动到锚点。

【问题讨论】：

标签： css angular typescript ionic-framework

【解决方案1】：

Ionic 处理它的 ion-content 组件中的滚动。

内容组件带有一些滚动方法，例如 scrollToPoint，它们可能对您有用。

要获取 IonContent 对象，您需要使用 ViewChild

import {ViewChild} from '@angular/core'
export class yourPage {
  @ViewChild('ion-content') content: IonContent;
  scroll(x, y) {
    this.content.scrollToPoint(x, y, 300)
  }
}

如果您想滚动一定距离，也可以选择 scrollByPoint

【讨论】：