DEV Community 👩‍💻👨‍💻

ivkeMilioner
ivkeMilioner

Posted on

I have an error when I want to save to the redux state. A non-serializable value.

I have an error when I want to save to the redux state.

A non-serializable value was detected in action, in the path: payload. picture. Value: FileList {0: File, length: 1}

Take a look at the logic that dispatched this action: {type: 'books/addToListOfBooks', payload: {…}}

<input
          type="file"
          {...register('picture', {
            validate: {
              lessThan10MB: (files) =>
                files[0]?.size < 1024 * 1024 || 'Max 1MB',
              acceptedFormats: (files) => {
                const pictureType = files[0]?.name
                  .toLowerCase()
                  .split('.')
                  .pop()
                return (
                  ['jpeg', 'png', 'gif'].includes(pictureType) ||
                  'Only PNG, JPEG e GIF'
                )
              },
            },
Enter fullscreen mode Exit fullscreen mode

Top comments (5)

Collapse
 
fjones profile image
FJones • Edited on

Well, a FileList isn't serializable. And redux state should only contain serializable data. That's what the warning is telling you. (Incidentally, the message itself shows why: It can't even properly serialize it for output on the console!)

Collapse
 
decker67 profile image
decker

This is something for stack overflow

Collapse
 
axel_nieminen_072275fab50 profile image
niemax • Edited on

Are you severely bothered or can we move on with our lives with this post being in here? 😊

Collapse
 
decker67 profile image
decker

Yes it is the quality I am missing here at dev.to.
Use the right tool for the job and dont spam around everywhere.

This post blew up on DEV in 2020:

js visualized

🚀⚙️ JavaScript Visualized: the JavaScript Engine

As JavaScript devs, we usually don't have to deal with compilers ourselves. However, it's definitely good to know the basics of the JavaScript engine and see how it handles our human-friendly JS code, and turns it into something machines understand! 🥳

Happy coding!