항해/항해99

항해99 TIL06 Today I Learned Styled components

youngble 2021. 11. 22. 00:29

for문과 if문등 ` `백틱안에서 쓸수없지만 삼항연산자, &&,|| 등은 쓸수있다. 또한 ${}를 사용하여 그안에 화살표함수를 만들어줄수도있다.

그리고 해당 변수태그안에 p라는 자식요소가 있다면 위의 styled 안 ``에서 그냥 css 쓰듯이 p{color : blue} 같은 형식으로 써주면된다. 

 

 

Export import 관계, {} 중괄호 있고 없고의 차이

export 할때  {c} 와같이 중괄호를 주고 하면 import 할때도 그렇게 가져오고

default 로 줄경우 {} 가 필요없다. 단 default 는 한개의 js 파일에서 한개만 가질수있다.

 

자바스크립트 변수쓸땐 중괄호{}안에 넣어준다.

 

styled components 문법중하나가 `` 안에 & 를 쓰면 나자신이라고 나타내는것이다 따라서 &:hover 는 나자신에 hover 가 발생하면 실행한다 라는 문법이다. 즉 위에서 MyStyled 라는 변수의 styled components 가 나자신을 의미한다. 그 영역에 마우스를 가져다대면 색이 노란색으로 변한다.

'항해 > 항해99' 카테고리의 다른 글

TIL 08 firestore +복습  (0) 2021.11.24
항해99 TIL 07 리덕스  (0) 2021.11.22
(WIL)weekly I learned 03 회고록  (0) 2021.11.21
항해99 TIL05 JSX  (0) 2021.11.21
항해99 TIL 04  (0) 2021.11.19