استخدم nuxtjs و nuxtServerInit ويظهر خطأ عند تحديث الصفحة

إلامً تتبع الخاصية store؟ وأرجو إرفاق باقي الشيفرة والأجزاء التي ترتبط بالصفحة و الخطأ

يظهر لي الخطأ حتى مع هذا الكود

  async nuxtServerInit({ commit, dispatch }, { req }) {
    const res = await dispatch('getData', { route: '/users/user' });
    
  },
    
    
      async getData({ commit }, payload) {
    try {
      const route = payload.route;
      const res = await this.$axios.$get(route);
      return res;
    } catch (error) {
      console.log(error);
      // return error.response.data;
    }
  },

يعني حتى مع dispatch يظهر خطأ Cannot read property '$store' of undefined

بتاريخ 16 دقائق مضت قال مضحي Modhy:

يعني حتى مع dispatch يظهر خطأ Cannot read property '$store' of undefined

سوف نجرب تحويل الدالة إلى arrow function

 async nuxtServerInit({ commit, dispatch }, { req }) => {
    const res = await dispatch('getData', { route: '/users/user' });
    
  },

حاول ذلك، السبب هو في الوصول ل this في باقي الشيفرة، التي لم ترفقها - جزء استعمال store

أضفت => قبل جسم الدالة

حاول استبدال

computed: {
            items() {
                return this.$store.state.items;
            }
        },

ب

computed: {
    items() {
        return store.state.items; // الوصول ل  store مباشرة بدون المرور على vue
    }
},

حاول أيضا فصل إعداد المخزن عن استدعائه 

بتاريخ 20 دقائق مضت قال Wael Aljamal:

سوف نجرب تحويل الدالة إلى arrow function

لا يمكن فعل هذا ، يظهر خطأ .

بتاريخ 21 دقائق مضت قال Wael Aljamal:

حاول أيضا فصل إعداد المخزن عن استدعائه 

كيف يمكن فعل هذا ؟

بتاريخ 1 دقيقة مضت قال مضحي Modhy:

لا يمكن فعل هذا ، يظهر خطأ .

كيف يمكن فعل هذا ؟

ارجو مشاركة الشيفرة بشكل كامل، لنفهم كيفية توزيعك للشيفرات البرمجية.

الفصل إلى ملفين، يكون بجعل ملف الإعداد ل Voux.store بملف منفصل وتصديره لآخر..

إن كنت تستعمل this.$store ربما الخطأ من مرجعية this.

....

بشكل عام أنت تستخدم دالة غير متزامنة، async لذلك من الطبيعي تأخر تخزين المتجر، حول الشيفرة إلى promise واستخدم then..

جربت طريقة promise ولم تفلح ، يظهر نفس الخطأ

جربت استخدام axios بشكل منفصل يظهر خطأ من نوع آخر

تبين في النهاية ان المشكلة ربما من تسلسل api

لان جعلت التواصل مباشره للراوت من دون الميديل وير ولم يظهر الخطأ نهائياً

بتاريخ 8 دقائق مضت قال مضحي Modhy:

جربت طريقة promise ولم تفلح ، يظهر نفس الخطأ

جربت استخدام axios بشكل منفصل يظهر خطأ من نوع آخر

تبين في النهاية ان المشكلة ربما من تسلسل api

لان جعلت التواصل مباشره للراوت من دون الميديل وير ولم يظهر الخطأ نهائياً

حسناً شكراً لك على إضافة توضيح للمشكلة، يمكنك إرفاق الحل النهائي إن وجدته ليستفيد من يقرأ السؤال.

بتاريخ 5 دقائق مضت قال Wael Aljamal:

حسناً شكراً لك على إضافة توضيح للمشكلة، يمكنك إرفاق الحل النهائي إن وجدته ليستفيد من يقرأ السؤال.

المشكلة ما اظن انها عامة، لربما لا يقع بها الا ما ندر من الناس وصياغة خاصة لا اظن يعمل بها احد.