In my current project, I am attempting to display a string that changes when a button is pressed in my NextJs application.
Here's the code snippet I am working with:
'use client'
import { useState } from 'react'
export default function Home() {
const [ currWord, setCurrWord ] = useState<string>('none');
return (
...
<p>{currWord}</p>
...
<button onClick={() => setCurrWord('changed')}>change</button>
...
)
}
When I click the button, the webpage and hence the string do not update. This issue persists even if the content is numeric. Initially, I tried implementing a function to change the word upon clicking the button, but it didn't work as expected. I'm puzzled by this since my approach seems similar to other examples I have come across.
Edit 1: For reference, I am using VSCode 1.76.2, Next.js 13 with the new app Folder and TypeScript version 5.1.0 (I also tested with version 4.6.3)