為了這個問題是各種搜，最后的結果是沒搜到，我寫下我的解決方案吧，其實挺簡單的。
image.png
首先最重要的你得先找到Table組件中的table，就是這個class：ivu-table-body。然后在mounted方法中找到這個dom元素，并監聽他的scroll。（created方法中拿不到dom元素），因為在created方法中dom元素還沒有渲染完成。
mounted() {
document.getElementsByClassName('ivu-table-body')[0].addEventListener('scroll', (event) => {
// console.log(event.target.scrollTop);
console.log(event);
this.tableScroll = event.target.scrollTop;
});
},
這個event里是什么呢。請看下面
image.png
然后繼續往target里看，里面有很多屬性，直奔最下面，
image.png
那么怎么結合vuex來使用呢？
state中
const state = {
transobjectData:{},//為了記錄transobject頁面的數據
};
mutations.js中
export default{
SET_TransObjectData(state,transobjectData){
state.transobjectData = transobjectData;
}
}
getters.js中
export default{
getTransObject:(state) => state.transobjectData,
}
vuex配置好之后，然后在路由發生變化的時候，存下數據
beforeRouteLeave(to, from, next) {
this.$debug.log(to);
this.$debug.log(from);
if (to.path == '/transobjectsalelist') {
this.$debug.log(this.data);
this.$store.commit('SET_TransObjectData', {
address: this.address,
data: this.data,//數據
page: this.page,//當前第幾頁
scroll: this.tableScroll, //存儲滾動
});
} else {
this.$store.commit('SET_TransObjectData', {});
}
// this.$store.commit('SET_IndexScroll', position) //離開路由時把位置存起來
next()
},
當再次進入這個路由的時候,再created方法中搞個恢復數據的方法recoveryData
recoveryData() { //恢復數據
var d = this.$store.state.transobjectData;//拿到數據
if (d.address == this.address) {
this.$debug.log(d);
this.data = d.data;
this.address = d.address;
this.page = d.page;
this.tableScroll = d.scroll;
setTimeout(() => {//這里要延遲下滾動
document.getElementsByClassName('ivu-table-body')[0].scroll(0, d.scroll);
}, 400)
return;
}
},
好了這就是這個問題的解決辦法。
想到了之前搞過一個相似的問題，直接貼出解決辦法，是頁面返回到原來的位置。
離開的時候存下數據
beforeRouteLeave(to, from, next) {
let position = window.scrollY //記錄離開頁面的位置
if (position == null) position = 0
this.$store.commit('SET_IndexScroll', position) //離開路由時把位置存起來
next()
},
回來的時候直接刷新。
popScrollY() {
let indexScrollY = this.$store.state.indexScrollY
window.scroll(0, indexScrollY)
},
