Cộng đồng Hỏi & Đáp của Inflearn
câu hỏi đã được viết
ref 관련 질문있습니다!
Đã giải quyết
Viết
·
268
1
<input ref={ref => ref && setText(INITIAL_TEXT)}>라는 코드에서
ref && setText(INITIAL_TEXT)
ref 가 <input> 객체를 의미하는 건 알겠는데
이게 어떤 의미고 어떻게 작동하는건지 쉽게 와닿지가 않아서 설명 부탁드려요!
Câu trả lời 3
1
&& 연산자는 AND 연산자가 맞구요, 첫 false 를 만날 때까지 계속 평가(evalution)를 합니다
`a && b && c` 에서 a와 b 모두 true 이면 c가 평가됩니다
반대로 a와 b 중에서 하나라도 false 이면 c는 평가되지 않습니다.
c가 만약 함수 호출이라면 `평가 = 함수 호출` 이라고 이해하시면 됩니다
그래서 `ref && setText(INITIAL_TEXT)` 는 ref 가 있으면 `setText(INITIAL_TEXT)` 를 실행하라는 의미가 됩니다
사실 if 문을 써도되는데요
&& 연산자가 좀 더 간결해서 이 방식을 선호하시는 분들도 있습니다 (if 문을 선호하시는 분들도 있구요)
1
아 작동방식에 대한 설명은 이제 이해가 완전히 된 것 같습니다! 그런데 ref && setText(INITIAL_TEXT) 부분에서 &&은 기존 자바스크립트 문법처럼 and연산자의 의미로 이해해주는건가요?
ref요소가 생성되면 => setText를 실행해라
ref요소가 없으면(null) => 실행하지마라 이런식으로 이해하면 될까요?
1
안녕하세요
리액트에서 ref 를 입력하는 방식은 두 가지가 있는데요
useRef 를 이용하는 방식이 일반적입니다
하지만 useRef 는 요소가 생성되고 소멸되는 이벤트를 받을 수 없다는 단점이 있습니다.
첨부해주신 코드는 ref 에 함수를 입력하는 방식입니다
ref 에 함수를 입력하면 요소가 생성되고 소멸될 때 해당 함수가 호출됩니다
단, 소멸될 때는 ref 매개변수의 값은 null 입니다
따라서 `ref && setText(INITIAL_TEXT)` 는 요소가 생성될 때 `setText(INITIAL_TEXT)` 를 실행하는 코드입니다
요소가 생성되고 소멸될 때 호출된다고 했지만, 그외에도 호출되는 경우가 있는데요
입력된 함수가 변경될 때 입니다
위 코드처럼 입력하면 렌더링될 때마다 매번 새로운 함수가 입력되죠
그래서 요소가 생성되고 소멸되지 않아도 (위 코드에서는) 입력된 함수가 호출됩니다