How can I implement smooth scrolling for router links using VueRouter?
<router-link :to="{ hash: 'home' }">Home</router-link>
<router-link :to="{ hash: 'about' }">About</router-link>
Here is the code in router.js:
import Vue from "vue";
import VueRouter from "vue-router";
import Home from "../vue/home";
import About from "../vue/about";
Vue.use(VueRouter);
export default new VueRouter ({
mode: "history",
routes: [
{path: "/", name: "home", component: Home},
{path: "/about", name: "about", component: About},
],
scrollBehavior(to, from, savedPosition) {
return {
selector: to.hash,
behavior: 'smooth'
}
}
});
The smooth-scroll effect in VueRouter appears slower than Vue's v-smooth-scroll class. Is there a way to adjust the speed of smooth scrolling in VueRouter?