Vue 路由器滚动到 vue-view comp

问题描述 投票:0回答:0

我正在 Vue 中创建一个应用程序,我希望所有主要内容都在一个页面上,可以选择滚动到特定元素,例如 LandingPage,然后在 Form、About ..etc. 下方

有什么方法可以使用 Vue 路由器在页面上设置这些组件,以便当我单击路由器链接时它会滚动到元素并像普通路由器链接一样更改补丁?它应该工作的方式是它向主 app.vue 组件添加一个路由器视图集群。

手动滚动后,我希望为当前显示的项目(组件)显示补丁,当我在菜单中按 routerlink 时,我将被带到该项目。

我尝试了几种解决方案,但没有给我结果。 这是一个页面示例(有趣的是它是一个 vue 页面),您可以在其中使用这样的功能。 🙂

https://router.vuejs.org/.../advanced/navigation-guards.html

这是主链接,在我的例子中是 / 本身,在从菜单中选择一个选项后,它会在右侧将我滚动到#something item

提前感谢您的帮助🙂.

我希望 app.vue 中有一个组件:

<router-view name="home" ></router-view>.
<router-view name="Form" ></router-view>.
<router-view name="About" ></router-view>.

并显示具体的组件 我这样试过:

const routes = [
  
    {
      path: '/',
      name: 'landingPage',
      children: [
          {
            name: '#home',
            path: '/',
            components: {
              landigpage,
            }
          },
          {
            name: '#abaut',
            path: '/',
            component: about,
          }
      ]
    },
  ];

不幸的是,这个选项不起作用 即使这些路由不会嵌套也不行

提前致谢:)

javascript html vue.js vue-component vue-router
© www.soinside.com 2019 - 2024. All rights reserved.