Хранение объектов с использованием прототипов в состоянии Redux

Question

Является ли это плохой практикой для хранения классов в состоянии? Я читал, что состояние должно быть легко сериализуемыми объектами, а классы нарушают это соглашение.

Я создаю веб-приложение, которое использует реакцию/редукцию с набором моделей поддержки для сбора информации от пользователя.

Так, например, у меня есть следующие модели:

class Person { 
    constructor(params = {}) { 
    this.firstName = params.firstName || ''; 
    this.lastName = params.lastName || ''; 
    this.gender = params.gender || ''; 
    this.dateOfBirth = params.dateOfBirth || ''; 
    this.stateOfResidence = params.stateOfResidence || ''; 
    this.email = params.email || ''; 
    } 
    validateField(args) { 
    // remove for brevity 
    } 
    valid(args) { 
    // remove for brevity  
    } 
} 

Объект добавлен в хранилище, выполнив следующую actionCreator:

export function addPerson(args = {}) { 
    return (dispatch) => { 
    dispatch({ 
     type: 'ADD_PERSON', 
     obj: new Person(args) 
    }); 
    }; 
} 

Соответствующий человек редуктор торчит его в состояние так Я могу получить от него все остальное приложение.

Таким образом, когда я захвачу объект из состояния, я могу запустить его валидацию и действительные функции прототипа, чтобы увидеть, действительно ли модель действительна и реагировать соответствующим образом.

Является ли это нарушением реакции/соглашения о сокращении? Каким будет другой способ подойти к этой проблеме? Каковы потенциальные проблемы, с которыми я мог столкнуться в будущем с помощью вышеуказанного подхода? Сейчас не предвидит никаких проблем ... но я также не имеют большого опыта работы с реагировать/Redux (~ 4 месяца)

Edit:

Я хотел бы добавить, что я только мутировать состояние объекта через редукторы. Я стараюсь не мутировать состояние в другом месте приложения.

Answer 1

Да, это обычно считается анти-шаблоном, потому что он ломает способность делать такие вещи, как отладка во время путешествия (одна из основных точек продаж Redux). Дополнительную информацию см. В FAQ по Redux на странице http://redux.js.org/docs/FAQ.html#organizing-state-non-serializable.

Если вы хотите иметь больше объектного фасада над вашими равными данными, вы можете посмотреть что-то вроде https://github.com/tommikaikkonen/redux-orm.