'Nextjs: Objects are not valid as a React child (found: object with keys {...})
I'm building a form with multiple pages, but my button to toggle the page throws an error.
Objects are not valid as a React child (found: object with keys {0, 1, 2})
const RegisterPage = ()=> {
const [formPage, setFormPage] = useState(0)
return (
<div>
{formPage == 0 &&
<div>
<button onClick={()=> {setFormPage((c)=> c + 1)}}>Next</button>
</div>
}
{formPage == 1 &&
<div>
<button onClick={()=> {setFormPage((c)=> c - 1)}}>Back</button>
</div>
}
</div>
);
}
export default RegisterPage;
I have a different element with kind of the same mechanic and it works just fine:
<div className="icon" onClick={()=> {setPwVisible(true); setPwType("text")}}>
I already did some research but I couldn't get it fixed. What am I missing here? Thanks!
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|