router: {
middleware: 'i18n',
scrollBehavior: async function(to, from, savedPosition) {
if (savedPosition) {
return savedPosition;
}
const findEl = async (hash, x = 0) => {
return (
document.querySelector(hash) ||
new Promise(resolve => {
if (x > 50) {
return resolve(document.querySelector("#app"));
}
setTimeout(() => {
resolve(findEl(hash, ++x || 1));
}, 100);
})
);
};
if (to.hash) {
let el = await findEl(to.hash);
if ("scrollBehavior" in document.documentElement.style) {
return window.scrollTo({top: el.offsetTop-50, behavior: "smooth" });
} else {
return window.scrollTo(0, el.offsetTop);
}
}
return { x: 0, y: 0 };
}
},
路由的配置
<nuxt-link
:to="{
name: 'Business-Case',
hash: '#Asartists',
params: { Language: flag },
}"
>
Link
</nuxt-link>
///name:路由
///hash:锚点链接
///params:传参
nuxt-link 的使用
created() {
this.flag = this.$route.params.Language、
}
///接受传来的参数
mounted() {
// 滚动到顶部
window.scrollTo(0, 0)
},
因为nuxt路由过来会有记录screenTop 所以打开归零
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
喜欢就支持一下吧