Vue.js / Nuxt.js

Просунуті патерни Vue

Provide/inject, custom directives, render functions, JSX, teleport, suspense, async components

24 питань зі співбесід·
Senior
1

Яка основна мета provide/inject у Vue 3?

Відповідь

Provide/inject дозволяє передавати дані від батьківського компонента до будь-якого нащадкового компонента без передавання props через кожен проміжний рівень. Це дозволяє уникнути 'props drilling', коли props доводиться передавати через кілька рівнів компонентів, які їх не потребують. Особливо корисно для спільного використання глобальних даних, як-от конфігурація теми чи стан автентифікації.

2

Як оголосити значення за допомогою provide у компоненті, що використовує Composition API?

Відповідь

У Composition API використовується функція provide з двома аргументами: ключем (string або Symbol) і значенням, яке потрібно надати. Наприклад, усередині setup. Це значення буде доступне нащадковим компонентам через inject. Використання Symbol як ключів гарантує унікальність та запобігає колізіям імен.

3

Яка основна функція директиви Teleport у Vue 3?

Відповідь

Teleport дозволяє рендерити вміст компонента в іншому DOM-вузлі, ніж його позиція в дереві компонентів Vue. Зазвичай використовується для модальних вікон, підказок і сповіщень, які потрібно рендерити в корені документа, щоб уникнути проблем із z-index та CSS-позиціюванням. Компонент зберігає свій контекст Vue і може отримувати доступ до даних батьківського компонента.

4

Який атрибут є обов'язковим для використання Teleport у Vue 3?

5

Що таке custom directive у Vue?

+21 питань зі співбесід

Інші теми співбесід Vue.js / Nuxt.js

Опануй Vue.js / Nuxt.js для наступної співбесіди

Отримай доступ до всіх питань, flashcards, технічних тестів, вправ code review та симуляторів співбесід.

Почни безкоштовно