reactjsobjectreact-hooks

DataCloneError: The object could not be cloned. [Firefox Browser]

I'm getting DataClone error when trying to transfer Data as an object into another page

On Crome browser I'm getting the error given below:

DataCloneError: Failed to execute 'pushState' on 'History': function () { [native code] } could not be cloned.

app.js

const app = () => {
  const profile = useContext(ProfileContext);
  console.log(typeof profile) // object type
  
  const gotoEditPage = () => {
   history.push({
     pathname: '/setting',
     state: {profile}
   })
  }
 return (
  <>
   <button onClick={gotoEditPage}>Next</button>
  </>
 )
}

Whether it is a Browser specific error.

Solution

  • DataCloneError actually occured because I was trying to transfer methods in an object. So to avoid this error just parse Object into JSON as given below

    const parseData = JSON.parse(JSON.stringify(profile));

    Now parseData can easily be transfered to another page.