三種方法實現Vue路由跳轉時自動定位在頁面頂部

2021-10-06 03:34:56 字數 618 閱讀 4274

在做vue專案的時候發現 當路由跳轉時 頁面是不會自動跳轉到頂部的 而是停留在當前已滾動的距離

實現方法其實很簡單 共有三種方法可實現頁面自動跳轉到頂部

在路由的main.js(router.js)裡新增如下**即可:

// 跳轉後自動返回頁面頂部

router.aftereach(() => )

const router = new vuerouter(

}})

router.beforeeach((to, from, next) => )
import vue from 'vue'

import vuerouter from 'vue-router'

vue.use(vuerouter)

const routes = [

] const router = new vuerouter()

export default router

// 跳轉後返回頁面頂部

router.aftereach(() => )

Vue路由跳轉的三種方式

瀏覽器在解析時,將它解析成乙個類似於標籤 注意 需要跳轉的路由需要在router index.js中引入 帶引數 query 傳引數 類似get,url後面會顯示引數 路由可不配置 query 傳參 this.router.push this.router.push query 類似於 get,跳轉...

vue跳轉頁面傳遞引數的三種方法

vue中this.router.push 路由傳值和獲取的兩種常見方法 path不能和params一起使用,否則params將無效。需要用name來指定頁面。使用params傳參要用name不能使用path 只是大概的介紹一下,如果想看詳細的引數用法可以檢視 的文章 第一種方法query傳參 thi...

vue三種頁面跳轉傳參方法

1 push方法 跳轉傳參 query傳參 引數會在鏈結後面顯示 this router.push params傳參 引數不會顯示在鏈結後面this router.push params傳參要用name 不能用path 切記!接受引數 this.route.params 和 this.route.q...