반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
Tags
- TLS
- import.meta.env
- web vital
- Cypress
- Testing
- JavaScript
- CloudFlare
- http3
- SSR
- msw
- QUIC
- vue-cli
- rendering
- CSS
- aws
- custom command
- caching
- 비동기
- 선택자
- api test
- ViTE
- typeScript
- devtools
- svelte
- ts error
- https
- e2e
- vue
- csr
- vue3
Archives
- Today
- Total
목록Inject (1)
Develop Note by J.S.
[Vue3] Provide/ Inject
Props로 데이터를 하위컴포넌트에 전달할 때, 하위 Component -> 하위 Component .... 등 전달해야하는 end 컴포넌트까지의 루트가 복잡해지면 props전달이 반복되는 비효율적인 데이터 전달을 prop 드릴링이라고 합니다. vuex, pinia 등의 상태관리 라이브러리를 사용하여 해결 할 수도 있지만, 특정 범위내에서만 유효한 데이터 전송 루트가 필요할 경우 Provide(데이터 제공)/ Inject(데이터 주입)을 이용할 수 있습니다. // 제공 컴포넌트 // 주입 컴포넌트 {{ location }} 또한 컴포넌트의 트리가 깊고 넓을 때, 다수의 개발자가 참여한 대규모 앱 개발 시에는 일반적인 provide 키워드 사용으로 인한 충돌 가능성이 있습니다. 이때 Symbol()을 사용..
FrontEnd/Vue3
2023. 6. 28. 18:02