Medium
What is the outcome of executing the following React code (using the useState
hook) to modify the style of a button?
import React, { useState } from 'react';
function App() {
const [isHighlighted, setIsHighlighted] = useState(false);
const buttonStyle = isHighlighted ? { backgroundColor: 'yellow' } : {};
return (
<button
style={buttonStyle}
onMouseEnter={() => setIsHighlighted(true)}
onMouseLeave={() => setIsHighlighted(false)}
>
Hover over me
</button>
);
}
Author: Vincent CotroStatus: PublishedQuestion passed 1270 times
Edit
3
Community EvaluationsNo one has reviewed this question yet, be the first!
28
Write the non-JSX equivalent of the following code:24
Write the missing code to render the children of the UserProfile component.15
Write a React component as a function14
Call a function on the first render of a React component13
Save the state used to display the selected page in a React component.10
Write a React component that updates the document title with each click and resets to 'React App' when the component unmounts.9
Use useCallback to optimize rendering in React