- bounty将在5天后过期**。回答此问题可获得+150声望奖励。helloworld希望引起更多人对此问题的关注:我的选项快用完了,为什么当我从一个按钮点击调用router.push时页面呈现得很好,而当计算后调用router.push时页面只呈现了一部分。
我遇到了一个问题,我实际上已经有相当一段时间了。我的设置是Vue3和Vuetify 3。
每当我在某种计算后换页时:
router.push({ name: 'AnotherPage', params: { id: index, variable: x} });
该页被重定向到"AnotherPage",但该页不可滚动,因此只呈现适合该页的页面部分。
执行F5刷新后,将呈现整个页面并使其可滚动。
我只是在使用锚点重定向到页面上的某个部分时才注意到这种行为,并发现它不起作用。
scrollToElement() {
if (this.$route.hash) {
const targetId = ref(this.$route.hash.replace('#', ''));
const eal = document.getElementById(targetId.value);
if (eal != null) {
eal.scrollIntoView();
}
}
},
当我从零开始加载页面时,这是有效的,但是当我使用前面提到的router.push方法时,它就不起作用了,尽管没有错误,所以组件能够找到链接到所请求的锚标记的元素。
另一件事是,当我执行一个硬编码的router. push从一个按钮点击,它的工作!
1条答案
按热度按时间x4shl7ld1#
在vuejs中,元素之间有一个父子依赖关系,从问题中还不清楚是否使用了视图,但是我假设是这样的,因为这是最佳实践。
router.push
对应于history manipulation:因此,如果您从parentmain-view执行此操作,它将工作,并自动通知子视图重新呈现(因为更改本身)emit
component event(child将值的更改通知给parent并重新呈现)请参阅此示例以获取演示:https://learnvue.co/tutorials/vue-emit-guide
把它放在一起:在mainView中有一个
update
函数,希望从childView中的RouterLink
调用该函数。该函数由updateParent
启动-因此定义了一个发射事件prev-next-click
。mainView用
RouterView
(不是视图的名称!)将其粘合在一起。