I have a condition like this. I want to enable text input if the button is pressed and can edit the text in it. the question is how to make the function in react js?
my Code:
function App() {
return (
<div className="App">
<label>URL : </label>
<input
placeholder='http://localhost:3000/123456'
disabled
/>
<button type='submit'>Active</button>
</div>
);
}
export default App;
Use useState hook and onClick event like in this example.
import React, { useState } from "react";
function App() {
const [active, setActive] = useState(false)
return (
<div className="App">
<label>URL : </label>
<input
placeholder='http://localhost:3000/123456'
disabled={!active}
/>
<button
type='submit'
onClick={() => setActive(!active)}
>
Active
</button>
</div>
);
}
