V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
coderMonkey
V2EX  ›  程序员

Vue 一个系统一个实例不就够了吗,什么情况需要多个实例

  •  
  •   coderMonkey · 269 天前 · 3024 次点击
    这是一个创建于 269 天前的主题,其中的信息可能已经有所发展或是发生改变。
    后端开发,最近在学习前端,Vue 里面不是一个实例就够了吗,只要挂载一个宽高 100%的根节点,后面页面都在这个根节点上变化不就好了吗

    看了下公司的项目,一个页面就是一个根节点,有点不能理解为啥要这样做
    第 1 条附言  ·  269 天前
    公司就是多个 html 页面,每个 html 页面都 new 一个 vue ;按我现在理解一个系统再多的页面也只要一个 Vue 实例就好了啊
    28 条回复    2023-08-03 14:28:56 +08:00
    Bingchunmoli
        1
    Bingchunmoli  
       269 天前 via Android
    我遇见些 html 的每个页面 new 一次 Vue 但后来的公司都是脚手架至少总体一个
    LandCruiser
        2
    LandCruiser  
       269 天前
    有外部系统引用你们的系统
    coderMonkey
        3
    coderMonkey  
    OP
       269 天前
    @LandCruiser 引用为啥需要多实例
    IvanLi127
        4
    IvanLi127  
       269 天前 via Android
    怕牵一发而动全身的情况下?你这个好像不算多实例,一个页面一个实例,多个 SPA 罢辽。
    iOCZ
        5
    iOCZ  
       269 天前
    如果是单页面,那就一个实例。如果多页面,那每个页面一个实例。
    tsanie
        6
    tsanie  
       269 天前
    见过一块 div 一个实例的没有 /doge
    coderMonkey
        7
    coderMonkey  
    OP
       269 天前
    @iOCZ 多页面我也可以一个页面直接做组件啊,然后路由跳转不行嘛
    weixiangzhe
        8
    weixiangzhe  
       269 天前
    弹窗 toast 类渲染到根部吧
    imben
        9
    imben  
       269 天前
    多页应用对 seo 更友好些
    LandCruiser
        10
    LandCruiser  
       269 天前
    @coderMonkey 每个外部系统需要的功能不一样,通过一个统一的入口暴露不合适。
    iOCZ
        11
    iOCZ  
       269 天前
    @coderMonkey 你那个叫单页面应用
    wednesdayco
        12
    wednesdayco  
       269 天前
    这不就是 MPA 和 SPA 的区别= =
    lisongeee
        14
    lisongeee  
       269 天前
    某些组件库会提供命令式的弹窗/通知方法,这种情况下创建的组件是独立的 vue 实例
    nulIptr
        15
    nulIptr  
       269 天前
    建议一步到位了解一下微前端是啥概念。。。
    coderMonkey
        16
    coderMonkey  
    OP
       269 天前
    @wednesdayco @iOCZ @HashV2 学到了,确实是 SPA 和 MPA 的区别,那什么情况下需要在 SPA 中创建多个实例呢,我看 Vue 的官方文档里说的是“想要 Vue 去控制一个大型页面中特殊的一小部分的时候需要创建多个实例”,不是很能理解
    obulks
        17
    obulks  
       269 天前
    你应该问你们的前端,而不是问我们
    molvqingtai
        18
    molvqingtai  
       269 天前
    @coderMonkey #16 前端控制路由用一个实例,每个页面一个实例应该是后端控制路由,相当于把 Vue 当高级的 Jquery 使用
    learningman
        19
    learningman  
       269 天前 via Android
    @coderMonkey 现在这个网页已经写好了,100 万行代码,你想用 vue ,你是打算把整个页面全部重写一遍,还是挂一小块先把需要加的新功能给加上?
    thinkershare
        20
    thinkershare  
       269 天前
    因为很多软件并不需要 SAP, 而只是仅仅将 Vue 作为一个 View Render Engine 。这种场景下完全可以使用 Vue, 但不使用任何现代化的前端构建工具。我们就有项目这样用过。
    thinkershare
        21
    thinkershare  
       269 天前
    SPA
    charlie21
        22
    charlie21  
       269 天前
    @thinkershare 这等于在使用一个(带虚拟 DOM )的 jquery , 用 vue ,在最小情况下,来控制一个 div
    wu67
        23
    wu67  
       269 天前
    部分重构又不想推倒整个项目, 又想换用新的技术, 在实际项目进行中就会出现这种情况.
    你公司这是多页面应用了, 你说的和 vue 官方文档默认的路子是单页面应用.

    还有另一种用法是维护一个通用框架页面(只有 header menu 和 tab), 然后把旧项目通过前者的 iframe 嵌套, 新模块通过单独新开项目的形式维护, 同样套到 iframe, 然后在主框架项目里面配置 tab 和路由.
    ZGame
        24
    ZGame  
       269 天前
    twitch 那个直播观看插件页面才是对微前端最好的一个例子!
    MENGKE
        25
    MENGKE  
       269 天前
    @weixiangzhe 常见的场景只能想到 toast
    SanYuan
        26
    SanYuan  
       268 天前
    @wu67 我司目前就是这样 原来的 jq+自研跑了很多年了,部分新的使用了 vue ;
    hgaogao
        27
    hgaogao  
       268 天前 via iPhone
    有些组件是命令式调用所以需要用到第二个实例来进行挂载,比如 model 、全凭的 loading
    cnuser002
        28
    cnuser002  
       268 天前
    你现在直接用 Vue 开新坑,基本都是单页应用。

    但 VUE 把自己叫做渐进式 Javascript , 它也可以在直接在 HTML 的 Script 中声明一个 Vue 实例,然后挂载到页面上的某个元素。

    中途加入 Vue 的项目一般就会用这种方式。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2784 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 15:18 · PVG 23:18 · LAX 08:18 · JFK 11:18
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.