Vue - Входные параметры

Входные параметры

Входные параметры нужны для того, чтобы принимать какие-то данные в компонент

С помощью defineProps() мы указываем, какие данные ожидает компонент

Мы можем указывать как в виде массива, так и в виде объекта:

defineProps([ 'title' ]);

defineProps({
 title: {
  type: String
 }
})

Отдаем же данные в компонент с написания атрибута, такого же, как и название пропса

<MyComp :title="title" />

У входного параметра при объектом виде есть 4 поля:

type - тип ожидаемых данных
required - true/false, где true - это означает то, что данные обязательно (иначе будет ошибка)
default - значение по умолчанию
validator(value) - функция, которая валидирует переданные данные

defineProps({
 title: {
  type: String,
  validator(value) {
   return value.length;
  }
 }
})

Входные параметры образуют одностороннюю привязку данных, что означает, то, что они не могут быть изменены внутри передаваемого компонента (мы только можем получить данные)