Day 27 - styled-components 笔记2

Q_Q ..

把 props 传入 styled-components

import styled from "styled-components";

const Button = styled.button`
  background: ${({ primary }) => (primary ? "palevioletred" : "white")};
  color: ${({ primary }) => (primary ? "white" : "palevioletred")};

  font-size: 1em;
  margin: 1em;
  padding: 0.2em 1em;
  border: 2px solid palevioletred;
  border-radius: 1em;
`;

export default function App() {
  return (
    <section className="App">
        <Button>Normal</Button>
        <Button primary>Primary</Button>
    </section>
  );
}