Vue从一个页面跳转到另一个页面指定位置(跨页面锚点定位))
从A页面跳转到B页面的boxCenter位置
1. B页面,在需要跳转到的指定位置添加id名(eg: id=‘boxCenter’)
2. A页面,添加点击方法
第一个参数为B页面路由地址,第二个参数为要跳转到的位置
3. A页面下toguid方法
methods:{
toguid(path,id){
var path=path
var Id=id;
localStorage.setItem('toId',Id);
this.$router.push(path);
}
}
4. B页面
created() {
this.$nextTick(()=>{this.toLocal()})
},
mounted() {
let _this=this;
_this.$nextTick(function(){
window.addEventListener('scroll',_this.handleScroll)
})
},
methods: {
toLocal(){
//查找存储的锚点id
let Id=localStorage.getItem('toId');
let toElement=document.getElementById(Id);
//锚点存在跳转
if(Id){
toElement.scrollIntoView()
}
}
}
//用完后记得将存储的锚点置空,否则会影响其他页面跳转到当前页面
destroyed() {
localStorage.setItem('toId','');
}