Getting Unexpected token r in JSON at position 0 error.
Here is my code :
import React, { useEffect, useState } from 'react';
const AddInventory = () => {
const [items, setItems] = useState([]);
const [isReload, setIsReload] = useState(false);
useEffect(() => {
fetch("http://localhost:5000/inventory")
.then((res) => res.json())
.then((data) => setItems(data));
}, [isReload]);
const handler = (e) => {
e.preventDefault();
const name = e.target.name.value;
const email = e.target.email.value;
const user = { name, email };
fetch("http://localhost:5000/inventory", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(user),
})
.then(response => response.json())
.then(data => {
const newUsers = [...items, data]
setItems(newUsers)
setIsReload(!isReload)
})
.catch((error) => {
console.error('Error:', error);
});
}
return (
<div className='container mt-5'>
<h4>this is add inventory {items.length}</h4>
<form onSubmit={handler} action="">
<input className='m-2' type="text" name="name" id="" placeholder='name' />
<input className='m-2' type="text" name="email" id="" placeholder='email' />
<input className='m-2' type="submit" value="Add User" />
</form>
{
items.map(item => <li key={item._id}>Name:{item.name} Email:{item.email}</li>)
}
</div>
);
};
export default AddInventory;
but i'm trying to understand what's wrong with my code. Maybe there is another probably that the server-side functionality that is usually responsible for generating and returning the stringified JSON failed.