关于 ViewBox 组件scrollTo指定位置的问题

[Tyrone2333]

我在home组件的watch里观察$route对象,当 从列表到具体文章时保存之前的滚动距离,当从文章退回列表跳转到之前的位置.我将滚动距离保存在home组件的data里(home是一个view-box嵌套router-view的组件).当我退回时使用this.$refs.viewBox.scrollTo(this.states.scrollTop)并不总是有效,经常都是回到顶部,请问这是怎么回事?

`
        watch: {
            $route(to, from) {
                let scrBody = this.$refs.viewBox.getScrollBody()
                let scrTop = this.$refs.viewBox.getScrollTop()
//                从列表到具体文章时保存之前的滚动距离
                if (to.name == "read_article" && from.name == "article") {
                    console.warn("从列表到具体文章" + scrTop)
                    this.states.scrollTop = scrTop
                }
//                从文章退回列表跳转到之前的位置
                if (to.name == "article" && from.name == "read_article") {
                    console.warn("从文章退回列表 this.states.scrollTop: " + this.states.scrollTop)
                    this.$refs.viewBox.scrollTo(this.states.scrollTop)
                }
            },
        },
`

[airyland]

问题应该不在于这个函数，而在于内容渲染，建议你 setTimeout 执行。

[Tyrone2333]

@airyland 是因为内容还没出来就滚动不到的原因?

[airyland]

目测是，你可以测试一下

[Tyrone2333]

@airyland setTimeout 延时0确实可以实现,但有个问题就是页面会一闪然后再到之前的位置

[airyland]

这个一闪的问题建议对内容使用 keep-alive，activated 时设定滚动距离。参考 demo，并不会出现一闪的问题。