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

vue3 中,如何使用 MQTT 或 websocket 统一接收数据,页面单独处理数据

  •  
  •   jahnsli · Mar 26, 2023 · 3402 views
    This topic created in 1129 days ago, the information mentioned may be changed or developed.

    vue3 中,如何使用 MQTT 或 websocket 统一接收数据,页面中单独处理数据

    mqtt.js
    
    
      const onConnected = () => {
        onMessage();
      }
      
      const onMessage = (data) => {
      	const {obj1,obj2} = data
        // 如何在这里将 obj1 数据传递 page1 ,将 obj2 数据传递 page2
      }
    
    
    page1
    
    在这里只接收 obj1 数据
    
    page2
    在这里只接收 obj2 数据
    
    13 replies    2023-04-03 13:57:19 +08:00
    vace
        1
    vace  
       Mar 26, 2023
    1. pinia 或者 vuex 之类的状态管理同步
    2. event bus: https://v3-migration.vuejs.org/breaking-changes/events-api.html

    bus.$emit('message-1', obj1)
    bus.$emit('message-2', obj2)

    page1:
    bus.$on('message-1', ...)
    page2:
    bus.$on('message-2', ...)
    pubby
        2
    pubby  
       Mar 26, 2023 via iPhone
    vuex 之类的,在 app 里 commit 消息

    page 里各自 subscribe ,取需要的数据
    hb1988
        3
    hb1988  
       Mar 27, 2023
    补充 rxjs ; customEvent ;
    musi
        4
    musi  
       Mar 27, 2023
    存到 store 里,然后页面自己拿
    erhsilence
        5
    erhsilence  
       Mar 27, 2023
    mitt
    jahnsli
        6
    jahnsli  
    OP
       Mar 27, 2023
    @vace event bus 或许可以,如果 pinia 的话 obj1 obj2 都存在一起,可能会很臃肿
    jahnsli
        7
    jahnsli  
    OP
       Mar 27, 2023
    @pubby 没太理解~~ 是否可以提供个简单的 demo
    jahnsli
        8
    jahnsli  
    OP
       Mar 27, 2023
    @musi 如果 pinia 的话 obj1 obj2 都存在一起,可能会很臃肿
    jahnsli
        9
    jahnsli  
    OP
       Mar 27, 2023
    @erhsilence 想到这个,但不知道还有没有更好的方案
    jahnsli
        10
    jahnsli  
    OP
       Mar 27, 2023
    @hb1988 单独引入 rxjs ,是否有点多余, customEvent 或许可以
    lingxiaoli
        11
    lingxiaoli  
       Mar 27, 2023
    @jahnsli #8 你就是用两个文件来定义 store 来存 最后还是在内存里 不清楚你所谓的不臃肿意义在哪里?
    musi
        12
    musi  
       Mar 27, 2023
    @jahnsli #8
    1. 只要你需要用数据,数据就会存在内存里,引用数据类型存多次也只是引用存了多次
    2. 如果你不需要数据,置为 null 就是
    rm0gang0rf
        13
    rm0gang0rf  
       Apr 3, 2023
    在下全局变量了,刚刚写完。。是不是很 low~
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5181 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 47ms · UTC 05:40 · PVG 13:40 · LAX 22:40 · JFK 01:40
    ♥ Do have faith in what you're doing.