React 内联样式不会影响我的自定义组件

React是一种流行的JavaScript库，用于构建用户界面。它使用组件化的思想来组织和管理应用程序的不同部分。React提供了一种内联样式的方式，可以将CSS样式直接应用于组件，而不是通过外部样式表。然而，有一些开发者担心使用React内联样式会对自定义组件产生一些负面影响。本文将讨论这个问题，并提供一些案例代码来帮助理解。

javascript
import React from 'react';
const Button = () => {
  const buttonStyle = {
    backgroundColor: 'blue',
    color: 'white',
    padding: '10px',
    borderRadius: '5px',
  };
  return (
    Click me
  );
};
export default Button;

javascript
import React from 'react';
const Button = ({ disabled }) => {
  const buttonStyle = {
    backgroundColor: disabled ? 'gray' : 'blue',
    color: 'white',
    padding: '10px',
    borderRadius: '5px',
  };
  return (
    Click me
  );
};
export default Button;

javascript
import React from 'react';
const Card = ({ title, content }) => {
  const cardStyle = {
    border: '1px solid gray',
    borderRadius: '5px',
    padding: '10px',
    margin: '10px',
  };
  const titleStyle = {
    fontSize: '20px',
    fontWeight: 'bold',
    marginBottom: '5px',
  };
  const contentStyle = {
    fontSize: '16px',
    lineHeight: '1.5',
  };
  return (
    
      
{title}
      
{content}
    
  );
};
export default Card;