nextjs onclick update value to textarea

nextjs

In a Next.js app, you can use the onClick event and the setValue function to update the value of a textarea element when a button is clicked. Here’s an example of how you can do this:

import React, {useState} from 'react'

function Example() {
    const [value, setValue] = useState('')

    function handleClick() {
        setValue('New value')
    }

    return (
        <div>
            <textarea value={value}/>
            <button onClick={handleClick}>Update value</button>
        </div>
    )
}

In this example, we have a textarea element and a button. When the button is clicked, the handleClick function is called, which updates the value of the value state variable using the setValue function. The textarea element is then updated to show the new value.

It’s important to note that the value prop of a textarea element is a controlled prop, which means that it must be set using the value prop and updated using the setValue function. If you try to update the value of the textarea element directly using the innerHTML property, for example, it will not work as expected.