Question

路线更改不会滚动到顶部，因此Vue创建者advises使用导航防护。在the updated version中：

Router.beforeEach(function (to, from, next) {
  window.scrollTo(0, 0)
  next();
})

完美，除了会在我的应用中产生此致命错误：ncaught TypeError：vue_router__WEBPACK_IMPORTED_MODULE_1 __。default.beforeEach不是函数

为什么？

以防万一，这是我完整的router.js文件：

import Vue from 'vue'
import Router from 'vue-router'
import Home from './views/Home.vue'
import PastEvents from './views/PastEvents.vue'
import BasicPage from './views/BasicPage.vue'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'home',
      component: Home
    },
    {
      path: '/past-events',
      name: 'past-events',
      component: PastEvents
    },
    {
      path: '/basic-page',
      name: 'basic-page',
      component: BasicPage
    }
  ]
})

Router.beforeEach(function (to, from, next) {
  window.scrollTo(0, 0)
  next();
})

Answer 1

您已将Router大写，这是类名。您要做的是将.beforeEach()添加到路由器的实例中。您会在文档中注意到，它们总是在添加防护符。router始终是小写字母。

当前，您将立即从模块中导出实例，因此您需要在创建new Router时先将其添加到变量中，然后再向其添加.beforeEach()子句最终将其导出。

const router = new Router({
  ...
})

router.beforeEach( ... )

export default router

Vue：beforeEach不是函数

1 个答案: