V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
scienhub
V2EX  ›  Vue.js

vue3 怎么解耦页面的路由关系和布局关系啊

  •  
  •   scienhub ·
    batchfy · Aug 30, 2024 · 2977 views
    This topic created in 609 days ago, the information mentioned may be changed or developed.

    比如我有几个页面之间的路由是继承关系,但是页面布局毫无关系; 但是有另外两个页面路由不相关,但是布局是类似的。

    1. 比如 /:username/project/:priject-id 这两个页面路由没有父子关系,但是页面布局有类似(例如都是左右分栏的)。我希望这两个页面能继承自同一个 layout 文件。
    2. 比如/:username/:username/:projectname这两个页面的路由有父子关系,但是页面布局毫无关系。这种情况下用 vue-router 似乎只能共用一个父 layout ?

    我看 nextjs 那种基于文件的路由能很好的把 layout 和路由 decouple ,不知道 vue-router 能不能做到这点。

    感谢大家!

    6 replies    2024-09-17 22:11:30 +08:00
    user4201
        2
    user4201  
       Aug 30, 2024
    parent component 使用动态组建,根据 router 传递的 layout 值渲染对应的 layout 文件
    Xu3Xan89YsA7oP64
        3
    Xu3Xan89YsA7oP64  
       Aug 30, 2024   ❤️ 1
    if-else 秒了
    scienhub
        4
    scienhub  
    OP
       Aug 31, 2024
    @xngiser 是啊,现在就是这么干的。导致 root layout 的逻辑很复杂。
    linlai
        5
    linlai  
       Sep 3, 2024
    刚刚看到你在「大四锐评简历」那个帖子的回复,所以过来咨询一下。
    请问还有前端兼职的需求吗?前端相关的我都可以 Cover 。
    he110te4m
        6
    he110te4m  
       Sep 17, 2024
    vite 有文件路由的插件,或者换 nuxt 原生支持文件路由
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1250 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 50ms · UTC 17:07 · PVG 01:07 · LAX 10:07 · JFK 13:07
    ♥ Do have faith in what you're doing.