React Js Clear Div Content
React Js Clear Div Content:To clear content in a React.js <div>, set its content or state to an empty value. Using React's state management, modify the state variable bound to the <div>'s content. For example, using hooks, utilize useState to manage content and setX to clear it:
Thanks for your feedback!
Your contributions will help us to improve service.
How can I clear the content of a <div> element in Reactjs?
The provided React.js code defines a functional component named "App" that utilizes the useState hook to manage a piece of content displayed within a <div>. Initially, the content is set to 'Font Awesome Icons'. The component also contains a button labeled "Clear Content". When this button is clicked, the clearContent function is triggered, which updates the content state to an empty string.
As a result, the content within the <div> is cleared. The component is rendered within a container and the user interface is managed using React and ReactDOM, allowing dynamic content manipulation on the web page.
React Js Clear Div Content Example
xxxxxxxxxx <script type="text/babel"> const { useState } = React; function App() { const [content, setContent] = useState('Font Awesome Icons '); const clearContent = () => { setContent(''); }; return ( <div className='container'> <h3>React Js Clear Div Content</h3> <div>{content}</div> <button onClick={clearContent}>Clear Content</button> </div> ); } ReactDOM.render(<App />, document.getElementById('app')); </script>Output of React Js Clear Div Content
