Css内联样式作为React组件中的属性

import React from 'react';

const MyComponent = ({ backgroundColor, fontSize }) => {
  const style = {
    backgroundColor: backgroundColor,
    fontSize: fontSize
  };

  return (
    <div style={style}>
      Hello, World!
    </div>
  );
};

export default MyComponent;

import React from 'react';
import styled from 'styled-components';

const StyledDiv = styled.div`
  background-color: ${props => props.backgroundColor};
  font-size: ${props => props.fontSize};
`;

const MyComponent = ({ backgroundColor, fontSize }) => {
  return (
    <StyledDiv backgroundColor={backgroundColor} fontSize={fontSize}>
      Hello, World!
    </StyledDiv>
  );
};

export default MyComponent;