jeudi 18 avril 2019

How to fix duplicate data location when use both redux and class object

I am trying to refactor my redux's reducer function, my intention is to move data manipulating function into a separated class. This should be like:

reducer.js

const initialState = {
  notes: []
}

function reducer(state = initialState, action) {
  switch (action.type) {
    case 'ADD_NOTES':
      let newState = Note.addNew(action.note);
      return newState;
    ...
  }
}

note.js

class Note {
  notes = [];

  function addNew(note) {
    return [...this.notes, note];
  }
}

My problem here is notes is stored in multiple location: the state parameter of reducer function and notes inside Note class. One way to fix this is to remove notes from the class and modify addNew function to addNew(notes, newNote) but this way I have to pass the data to every manipulating functions.

Are there any better solutions for it?

Aucun commentaire:

Enregistrer un commentaire