Vuejs-nuxt（SSR 模式）無法通過插件內的 getter 獲取 UserUUID。 它顯示未定義的 GetUserUUID

Question

我在我的 vuejs-nuxt 項目中使用 SSR 模式。 因此，每當我嘗試調用套接字事件時，我都需要將用戶 ID 從商店傳遞給該套接字。 GetUserUUID getter 在所有其他 API 中都可以正常工作。 但只有在從“plugin/socketio.js”文件調用的情況下才會失敗。 我需要一些幫助才能從 getter 獲取數據。

插件/socketio.js

export default async ({ store, $axios }) => {
   console.log(store.getters.GetUserUUID,"Current User UUID which is showing undefined");

function listenStock({ channelName, eventName }, callback) {
console.log("callback",callback);
window.Echo.channel(channelName).listen(eventName, callback);
}

//Fetch user data
listenStock(
 {
  channelName: `BalanceUpdateEvent.${store.getters.GetUserUUID}`,
  eventName: "BalanceUpdateEvent"
 },
 ({ data }) => {
   console.log(data, "socket data");
   try {
     store.dispatch("setUserBalance", data.data.userBalance);
   } catch (ex) {
     console.log(ex);
   }
 }
);

nuxt.config.js

plugins: [
  { src: '~/plugins/socketio', mode: 'client' }
]
echo: {
   plugins: ['~/plugins/socketio.js']
},

此圖像是 console.log(store.getters) 的結果，但我需要訪問 GetUserUUID。

Answer 1

請在 nuxt.config.js 中嘗試

export default {
  plugins: [
    ....
    { src: '~/plugins/socketio.js', mode: 'client' }, // only on client side
    ...
  ]
}

在客戶端運行你的插件