求助 vue/pinia 高手,多 vue 实例如何共享一个全局 pinia 实例,且 vue 有自己的 pinia 实例?

2023-11-10 15:46:01 +08:00
 MinonHeart
const fakeGlobalPinia = createPinia()

function createVueInstance(container) {
    const app = createApp(...)
    
    // App 的 pinia 实例
    app.use(createPinia())
    
    // 想象中是这样的。
    app.use(fakeGlobalPinia)
    
    // ....
}

const vueApp1 = createVueInstance(...)
const vueApp2 = createVueInstance(...)

想象中是想上面的代码一样。

场景举例

假设有两个 vue app (在一个页面上),每个 app 都会控制主题的样式( theme ,这个是全局单例),我想把 theme 搞成一个全局的 store ,同时给两个 vue app 使用。但是每个 vue app ,也有自己的 store ,互不影响。

问题

  1. 单 pinia 能够实现这种效果吗?
  2. 有什么其他方式可以实现?还是我的思路不对
931 次点击
所在节点    前端开发
6 条回复
paopjian
2023-11-10 15:54:22 +08:00
window 设个全局变量直接取 window 的配置?.
MinonHeart
2023-11-10 16:02:46 +08:00
@paopjian 放哪不重要,主要是实现方式。能想到可以用 vue.reactive 实现,这样有点割裂。想知道单 pinia 能不能实现这个效果
qiaobeier
2023-11-10 21:19:57 +08:00
不太清楚你的需求,之前我有个项目有点类似吧,就是一套代码但是输出不同的 theme 。我的方案是使用环境变量物理切换文件的。比如 npm run dev/build --theme=one ,然后 nodejs 运行时使用不同的文件这样子。
ddch1997
2023-11-23 09:20:19 +08:00
单 pinia ,new 两个实例,然后 new vue 的时候一个为 store ,一个 commonStore ,是不是就可以了
sjhhjx0122
353 天前
放在 window 上然后在每个 vue 实例的时候注入下去用?
zhangdahai
44 天前
完全可以用一个 pinia 实例,state 里面放一个 data,另一个 fakeData ,操作是一样的,然后操作的时候判断当前运行的脚本 import.env.VITE_ENV == "prod" 就走 data 的操作逻辑,否则走 fakeData 实例的操作逻辑

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/990714

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX