• 0

طريقة تغيير ال boolean داخل object باستخدام redux

اريد ان اقوم بتغيير true ل false داخل array تحتوى على objects

 

 

import {ads} from '../../data/ads';
import {ADD_TO_FAVORITE, REMOVE_FROM_FAVORITE, CLEAR_FAVORITE} from '../types';

interface ItemInter {
  id: number;
}

interface ActionInter {
  type: string;
  payload: {id: number};
}

const initialState = {
  myAllAds: ads,
  myFavorite: [],
};

const myFavorite = (state = initialState, action: ActionInter) => {
  switch (action.type) {
    case ADD_TO_FAVORITE:
      const item = state.myFavorite.find(
        (item: ItemInter) => item.id === action.payload.id,
      );
      if (item) return {...state};

      return {
        ...state,
        myAllAds: [
          ...state.myAllAds,
          // state.myAllAds[action.payload].isFav === false,
        ],
        myFavorite: [...state.myFavorite, action.payload],
      };

    case REMOVE_FROM_FAVORITE:
      return {
        ...state,
        myFavorite: state.myFavorite.filter(
          favItem => favItem !== action.payload,
        ),
      };
    case CLEAR_FAVORITE:
      return {...initialState};
  }
  return state;
};

export default myFavorite;

جربت كتابة هدا الكود
myAllAds: [...(state.myAllAds[action.payload].isFav = false)],

ولكنه اخرج لى هدا الايرور

TypeError: undefined is not an object (evaluating 'state.myAllAds[action.payload].isFav = false')

تمّ تعديل بواسطة أحمد ابراهيم عبد الله
1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 1

الطريقة الوحيدة لعمل ما تريده في حالتك هي نسخ المصفوفة قبل التعديل عليها هكذا:

const newmyAllAds = [...state.myAllAds];
newmyAllAds[action.payload].isFav = false;
return {
  ...state,
  myAllAds: newmyAllAds,
  myFavorite: [...state.myFavorite, action.payload],
};

وبهذا يتم التعديل.

ولكن لماذا لا تتعلم redux-toolkit وحينها بدلاً من كل هذا التعقيد يصير تابع add شبيهاً بالتالي:

const item = state.myFavorite.find(
  (item: ItemInter) => item.id === action.payload.id,
);
if (item) return;
state.myFavorite.push(action.payload);
state.myAllAds[action.payload].isFav = false;

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 5 دقائق مضت قال أحمد حبنكة:

الطريقة الوحيدة لعمل ما تريده في حالتك هي نسخ المصفوفة قبل التعديل عليها هكذا:


const newmyAllAds = [...state.myAllAds];
newmyAllAds[action.payload].isFav = false;
return {
  ...state,
  myAllAds: newmyAllAds,
  myFavorite: [...state.myFavorite, action.payload],
};

وبهذا يتم التعديل.

ولكن لماذا لا تتعلم redux-toolkit وحينها بدلاً من كل هذا التعقيد يصير تابع add شبيهاً بالتالي:


const item = state.myFavorite.find(
  (item: ItemInter) => item.id === action.payload.id,
);
if (item) return;
state.myFavorite.push(action.payload);
state.myAllAds[action.payload].isFav = false;

 

شكرا على الاجابة ولكن لمادا تنصحنى ب redux tool-kit هل يمكنك ان تخبرنى لما هى جيدة

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ الآن قال أحمد ابراهيم عبد الله:

شكرا على الاجابة ولكن لمادا تنصحنى ب redux tool-kit هل يمكنك ان تخبرنى لما هى جيدة

ﻷن حالتك وحالات مشابهة لها تصير سهلة جداً بـredux-toolkit هذا عدا عن تنظيم كود redux بشكل جميل بالطبع.

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن