Vue использует provide и inject в качестве метода отправки данных на несколько уровней без необходимости использования свойств — но знаете ли вы, что можете установить значения по умолчанию для любых введенных данных, если они не будут введены в первую очередь? ? Давайте посмотрим, как это работает.

Установка значений по умолчанию с помощью предоставления и внедрения в Vue

Если вы не уверены, как обеспечить и внедрить работу, вы можете прочитать об этом здесь. По умолчанию inject ожидает, что для ключа provide будет установлено значение по умолчанию, и если это не так, он выдаст ошибку времени выполнения. Таким образом, полезно установить значение по умолчанию, чтобы не возникала ошибка времени выполнения.

Итак, давайте посмотрим на пример. Скажем, вы provide некоторые данные в своем родителе, как это:

<script setup>
    import { provide, ref } from 'vue'
    const message = ref('message');
    provide('myKey', message);
</script>

Если вы затем вставите его куда-нибудь, вы можете использовать второй аргумент, чтобы установить значение по умолчанию. Например:

<script setup>
    import { inject } from 'vue'
    const message = inject('myKey', 'the default value')
</script>

В этом примере, если myKey не может быть найдено, вместо него будет установлено значение по умолчанию the default value. Вы можете добиться того же с помощью API параметров, например:

export default {
    inject: {
        message: {
            myKey: 'the default value'
        }
    }
}

Установка значений по умолчанию для инжекторов в Vue является лучшей практикой и помогает предотвратить непредвиденные ошибки во время выполнения. Чтобы узнать больше о Vue, нажмите здесь.

Повышение уровня кодирования

Спасибо, что являетесь частью нашего сообщества! Перед тем, как ты уйдешь:

  • 👏 Хлопайте за историю и подписывайтесь на автора 👉
  • 📰 Смотрите больше контента в публикации Level Up Coding
  • 🔔 Подписывайтесь на нас: Twitter | ЛинкедИн | "Новостная рассылка"

🚀👉 Присоединяйтесь к коллективу талантов Level Up и найдите прекрасную работу