Styled Components bilen React-dä Şertli Rendirlenede Proplary ulanmak
Proplary şertli rendirlemek üçin hem ulanyp bolýar. Öňki sapakda işledik
React komponentimiz Block-a geçeliň.
Birinji input üçin fon sary, beýleki inputlar üçin bolsa ýaşyl bolsun.
Bunun üçin, Input komponentiniň stilinde ýene bir setir goşup, şeýle alyp bileris:
const Input = styled.input`
background: ${(props) => (props.first ? 'yellow' : 'green')};
margin: 5px;
font-size: 18px;
`;
Birinji inputa first propyny goşalyň:
<Container>
<Input first />
<Input placeholder="name" type="text" />
<Input type="password" />
</Container>
Sapagyň teoriýasynda görkezilen şertli rendirlemäni ulanmak bilen,
öňki sapakdaky meseläniň çözgüdini üýtgediň, şeýlelik bilen warn
propsy barda düwmäniň teksti gyzyl we onuň fony sary bolsun, ýok bolsa bolsa
- ýaşyl fon we ak tekst. warn propyny ikinji düwmä beriň.