CODEWITHSUNDEEP
reduxreact-redux
Malvineous
Malvineous

Reputation: 27330

How should React-Redux work with non-serializable data?

Let's say you are writing a web-based word processor app, and because you don't want to deal with reading and writing a bunch of different document formats, you use a third party library for that part.

The library returns a class instance when you read a document, which you modify and then pass back to the library to save the document again. You have to pass back the original instance to the library, so you need to keep hold of it while your app is editing the document.

Apparently you can't use this with React-Redux, because as soon as you try to save that class instance to the state, it complains that it's non-serializable. Fair enough, but how then should you hold on to this class instance?

The documentation contains a section titled Working with Non-Serializable Data which unfortunately doesn't actually tell you about working with non-serializable data, only that you should not do it. But in the example above it is unavoidable, so surely there is some way to do this without just disabling all the warnings and hoping for the best?

Are you supposed to store things like this in a global variable/singleton and just put flags in the Redux store, like "documentOpen: true" and just refer back to the global object when you need the instance again? That doesn't seem like a great way to do it, but I'm unable to find anything about how else to address this issue (other than just disabling the warning).

Upvotes: 3

Views: 508

Answers (1)

markerikson
markerikson

Reputation: 67489

Yes, per the docs, that kind of a class instance does not belong in the store state, because A) it's not actually "state", and B) it will not serialize correctly when used with the DevTools.

To me, that kind of a class instance either belongs strictly in the UI layer or in some kind of middleware, but it really depends on what that instance does and how you need to interact with it.

Upvotes: 1

Related Questions