Uncaught SyntaxError: "[object Object]" is not valid JSON
    at JSON.parse (<anonymous>)  
vendors~main.chunk.js:32926 The above error occurred in the <Home> component:

    at Home (http://localhost:3000/static/js/main.chunk.js:1640:99)
    at RenderedRoute (http://localhost:3000/static/js/vendors~main.chunk.js:131876:5)
    at Routes (http://localhost:3000/static/js/vendors~main.chunk.js:132298:5)
    at App
    at Router (http://localhost:3000/static/js/vendors~main.chunk.js:132236:15)
    at BrowserRouter (http://localhost:3000/static/js/vendors~main.chunk.js:130557:5)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.
console.<computed> @ vendors~main.chunk.js:32926
localhost/:1 Uncaught (in promise) SyntaxError: "[object Object]" is not valid JSON
    at JSON.parse (<anonymous>)
    at Home (main.chunk.js:1643:72)
  
VM23:2 Uncaught ReferenceError: process is not defined
  


**CODE**

const Home = () => { const scrollRef = useRef(null); const userInfo = localStorage.getItem('user') !== 'undefined' ? JSON.parse(localStorage.getItem('user')) : localStorage.clear(); useEffect(() => { const query = userQuery(userInfo?.sub);

     client.fetch(query).then((data) => {
       setUser(data[0]);
   })
   }, []);


   useEffect(()=>{
       scrollRef.current.scrollTo(0, 0);
    
     },[])

CodePudding user response：

while you are storing the data in the local storage use JSON.stringify(data) instead of directly storing the data.

CodePudding user response：

Seems like you are getting string "[object Object]" from the localStorage.getItem('user') which basically is useless. Keep in mind localstorage act as dictionary but ONLY stores strings not objects. As @Naman Agrawal pointed out, convert your data to string before storing it into localstorage

localstorage['user'] = JSON.stringify(data)