lzxb / vue-cnode

基于vue2 + vue-router + vuet + ES6 + less + flex.css重写vue版cnode社区,使用webpack2打包
1.12k stars 314 forks source link

vuet滚动加载返回列表页的默认位置 #32

Closed alasai closed 6 years ago

alasai commented 6 years ago

vuet滚动加载返回列表页,点击其中一条数据查看,再点击返回列表,默认又回到第一条数据位置了,请问如何修改

lzxb commented 6 years ago

使用v-vuet-scroll指令和vuet模块进行绑定

alasai commented 6 years ago

v-content v-vuet-scroll="{ path: 'bgs-list', name: 'content' }" 这个我已经加了呢

lzxb commented 6 years ago

那你列表的数据呢?是怎么管理的

lzxb commented 6 years ago

你可以查看一下这个地址的demo:https://github.com/medatc/vuet/tree/dev/examples/scroll-cnode

alasai commented 6 years ago

谢谢,解决了,是我加了window.scroll(0, 0)的原因,加这个是因为我用了hash模式 的缘故

lzxb commented 6 years ago

能记录滚动条了?

alasai commented 6 years ago

不能,因为他必须用history模式,我的是hash模式,请问beforeRouteLeave怎么在路由跳转前获取距离顶部的距离,我想点击返回再返回到制定位置, beforeRouteLeave(to, from, next){ next(vm => { alert("111") alert(vm.$refs.contentref.scrollTop) }) } 这样写法获取不到

lzxb commented 6 years ago

应该是在组件销毁之前记录

alasai commented 6 years ago

我现在的做法是beforeRouteLeave在这里记录let top=document.documentElement.scrollTop || document.body.scrollTop localStorage.setItem("gsktop",top); 然后在 beforeRouteEnter 里写 if(localStorage.getItem("gsktop")!=null) { window.scroll(0,localStorage.getItem("gsktop")) } 这样确实能实现效果,不过这样的做的话,每个列表页中都得这样做,有点麻烦了

lzxb commented 6 years ago

其实你用vuet,不用这么麻烦的

alasai commented 6 years ago

请问vuet在哪里用的,在什么地方操作vuet呢,方便写段代码吗,谢谢了

lzxb commented 6 years ago

....看楼上demo地址

alasai commented 6 years ago

你好,上面的vuetdemo 我看了, beforeRouteLeave 这里console.log(this.$vuet) 可以获取到vuet,怎么获取到VuetScroll

lzxb commented 6 years ago

VuetScroll 是当成指令使用的

alasai commented 6 years ago

嗯那么请问, this.$vuet.vm 这样的写法,怎么才能获取到距离顶部的scrollTop距离呢