CODEWITHSUNDEEP
reactjsreduxreact-reduxredux-saga
Stefan Dunn
Stefan Dunn

Reputation: 5513

Redux-saga store converts custom class to plain object

I'm trying to store a custom call User to the store using my reducer. The problem is, the reducer converts the custom class into a plain object by replacing the Class's properties to the plain object's properties. This means any class methods cannot be called when I get that class from the store.

My User class has a method getGroup which cannot be called after retrieving the user from the store.

So an example would be:

class User {
   constructor(data){
       this.data = data;
       this.id = data.id;
   }

   getGroup() {
       return this.data.group;
   }
}

Will convert to:

{
    data: {
        id: 1, 
        group: "Some group"
    },
    id: 1
}

I am using connect from the react-redux library to map the store state to React props.

Any idea how I can either:

Upvotes: 0

Views: 239

Answers (1)

markerikson
markerikson

Reputation: 67577

You shouldn't ever put non-serializable values in the Redux store in the first place:

Avoid putting non-serializable values such as Promises, Symbols, Maps/Sets, functions, or class instances into the Redux store state or dispatched actions. This ensures that capabilities such as debugging via the Redux DevTools will work as expected. It also ensures that the UI will update as expected.

Upvotes: 1

Related Questions