如何制作组件展示？

// Button.js
import React from 'react';
import './Button.css'; // 引入样式文件

function Button(props) {
  return (
    <button className="custom-button" onClick={props.onClick}>
      {props.label}
    </button>
  );
}

export default Button;

/* Button.css */
.custom-button {
  padding: 10px 20px;
  font-size: 16px;
  color: white;
  background-color: #007bff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.custom-button:hover {
  background-color: #0056b3;
}

// App.js
import React from 'react';
import Button from './Button';

function App() {
  const handleClick = () => {
    alert('Button clicked!');
  };

  return (
    <div className="App">
      <h1>Component Example</h1>
      <Button label="Click Me" onClick={handleClick} />
    </div>
  );
}

export default App;