ion-content 方法 scrollToPoint 不適用於 Ionic 5

Question

我正在關注這個ionic5和github文檔，以便以編程方式將我的頁面滾動到一個點。 以下是代碼

getContent() {
      return document.querySelector('ion-content');
}

scrollPage() {
      this.getContent().scrollToPoint(100,100);
}

方法scrollToPoint()沒有做任何事情。 還有另一種調用此方法的方法嗎？

Answer 1

您不能在選擇器獲得的項目上應用方法。 你必須是 select 這個 ion-content 帶有@ViewChild並且可以使用方法：

@ViewChild(IonContent) content: IonContent;

content.scrollToPoint(100,100);

Answer 2

如果有人在使用VueJS + Ionic 6時遇到問題。 我通過將 $ref 存儲在 mounted() 上的 data() 中使其工作。 不要忘記像這樣添加 ref 屬性： <ion-content ref="myContent"> 。

data() {
  return {
    myCustomContent: null
  };
}

在你的 mounted()

mounted() {
  this.myCustomContent = this.$refs.myContent.$el;
}

你的方法：

scrollFunction() {
  this.myCustomContent.scrollToBottom(500);
}