方法1:
// 可以用來獲取top值
// 可以不用加單位,這樣寫的話就是讓滾動到什麼位置
document.documentElement.scrollTop = 300
1
2
3
方法2:
//先獲取目標位置距離
mounted() {
this.$nextTick(() => {
setTimeout(() => {
let targetbox= document.getElementById('box');
//在data中定義
this.target= targetbox.offsetTop;
})
}
//再滑動指定距離
document.body.scrollTop = this.target;
4
5
6
7
8
9
10
11
12
方法3:
scrollTo,scrollBy,scroll滾動到某位置
//獲取的DOM元素不能為display:none
//一定要加this.$nextTick 這樣才可以事實更新
this.$refs.DOM.scrollTo(0,200);
//x 和 y 的 設定位置
//但在this.$nextTick(()裡執行滑動,感覺有點麻煩 我還沒有使用過
方法4:
document.getElementById("box").scrollIntoView();
//找到元素 scrollIntoView()方法讓當前的元素滾動到瀏覽器視窗的可視區域內
方法5:
scrollBehavior (to, from, savedPosition) {
return { x: 0, y: 0 }
方法1:
// 可以用來獲取top值
// 可以不用加單位,這樣寫的話就是讓滾動到什麼位置
document.documentElement.scrollTop = 300
1
2
3
1
2
3
方法2:
//先獲取目標位置距離
mounted() {
this.$nextTick(() => {
setTimeout(() => {
let targetbox= document.getElementById('box');
//在data中定義
this.target= targetbox.offsetTop;
})
})
}
//再滑動指定距離
document.body.scrollTop = this.target;
1
2
3
4
5
6
7
8
9
10
11
12
1
2
3
4
5
6
7
8
9
10
11
12
方法3:
scrollTo,scrollBy,scroll滾動到某位置
this.$nextTick(() => {
//獲取的DOM元素不能為display:none
//一定要加this.$nextTick 這樣才可以事實更新
this.$refs.DOM.scrollTo(0,200);
//x 和 y 的 設定位置
})
//但在this.$nextTick(()裡執行滑動,感覺有點麻煩 我還沒有使用過
1
2
3
4
5
6
7
1
2
3
4
5
6
7
方法4:
document.getElementById("box").scrollIntoView();
//找到元素 scrollIntoView()方法讓當前的元素滾動到瀏覽器視窗的可視區域內
1
2
1
2
方法5:
scrollBehavior (to, from, savedPosition) {
return { x: 0, y: 0 }
}