3
670//a.vue
export default {
events:{
SetScroll: function(){
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
scrollTop = 300;
alert(scrollTop);
}
},
route: {
data: function () {
this.$emit('SetScroll')
}
}
}a组件页面是用ajax请求数据后v-for渲染的一个列表页。
需求是从a组件跳到同级的b组件然后再跳回来的时候要把滚动位置定位在300这里。现在问题是每次返回a组件时alert能正常弹出来，但位置就是在顶部没有滚下来。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
Vue 的节点是异步渲染，当执行到
scrollTop = 300时页面节点不一定渲染了出来，来举个例子：如上图，
this.listData已经明明被赋值，浏览器里面却没有任何东西渲染出来。再看下一张图：在
setTimeout进行断点，此时可看到方块已经被v-for出来了。那么结论就很明显：题主在执行
scrollTop = 300时因为页面中根本没有渲染出组件，因此很可能是因为高度不够，滚不到 300.解决方法也很简单，使用
setTimeout将操作推入任务队列，在v-for执行完毕后再scrollTop.另外发现：滚动用法有问题，这样只是取值.
nextTick
http://cn.vuejs.org/api/#Vue-...