[Vue] 4. Style Guide

1. 우선순위 특징

---

• A : 필수 (Essential)
  • 오류를 방지하는 데 도움이 되므로 어떤 경우에도 규칙을 학습하고 준수

• B : 적극 권장 (Strongly Recommended)
  • 규칙을 어겨도 코드는 여전히 실행되겠지만, 규칙 위반은 드물어야 함.

• C : 권장 (Recommend)

2. 오늘 배운 것 중에 지켜야 할 우선순위

---

• 우선순위 A
  1. v-for는 항상 key와 함께 사용하기
     • 내부 컴포넌트의 상태를 일관되게 유지하기 위해 v-for에 항상 key를 사용하기
     • 데이터의 예측 가능한 행동을 유지 시키기 (객체 불변성)
  2. v-for를 쓴 엘리먼트에 절대 v-if를 사용하지 않기
     • 목록의 항목을 필터링 할 때
       • v-if > v-for (우선선위) 이기 때문에 해당 처리 시점에 반복 변수인 user가 존재하지 않기 때문에 에러 발생 ⇒ computed 속성을 대신 반복하여 해결
       • cf) Vue2 에서는 우선순위가 v-for > v-if 이다.

       <!-- bad -->
       v-for="user in users"
       
       <!--good-->
       v-for="user in Activeusers"

Uploaded by N2T