1import React, {useState} from "react";
2
3export default function ShowButtonHover() {
4    const [style, setStyle] = useState({display: 'none'});
5
6    return (
7        <div className="App">
8            <h2>Hidden Button in the box. Move mouse in the box</h2>
9            <div style={{border: '1px solid gray', width: 300, height: 300, padding: 10, margin: 100}}
10                 onMouseEnter={e => {
11                     setStyle({display: 'block'});
12                 }}
13                 onMouseLeave={e => {
14                     setStyle({display: 'none'})
15                 }}
16            >
17                <button style={style}>Click</button>
18            </div>
19        </div>
20    );
21}
22