Easy
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: W3D TeamStatus: PublishedQuestion passed 2076 times
Edit
4
Community EvaluationsNo one has reviewed this question yet, be the first!
36
Write the non-JSX equivalent of the following code:18
Call a function on the first render of a React component11
Use useCallback to optimize rendering in React32
Write the missing code to render the children of the UserProfile component.15
Save the state used to display the selected page in a React component.10
Find the issue with this React code:10
Write a React component that displays the sum of two numbers