> For the complete documentation index, see [llms.txt](https://d-ukolov.gitbook.io/vue/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://d-ukolov.gitbook.io/vue/komponenty/vkhodnye-parametry-props/validaciya-vkhodnykh-parametrov.md).

# Валидация входных параметров

Компоненты могут указывать требования к своим входным параметрам, такие как определение типа. Если эти требования не выполнены — Vue предупредит сообщением в JavaScript-консоли браузера. Это особенно полезно при разработке компонента, который предназначен для использования другими.

Чтобы указать валидации входного параметра, можно предоставить в `props` объект с валидациями для проверки значения, вместо массива строк.&#x20;

Например:

```javascript
Vue.component('my-component', {
  props: {
    // Просто проверка типа (`null` и `undefined` проходят проверку для любого типа)
    propA: Number,
    // Несколько допустимых типов
    propB: [String, Number],
    // Обязательное значение строкового типа
    propC: {
      type: String,
      required: true
    },
    // Число со значением по умолчанию
    propD: {
      type: Number,
      default: 100
    },
    // Объект со значением по умолчанию
    propE: {
      type: Object,
      // Для объектов или массивов значения по умолчанию
      // должны возвращаться из функции
      default: function () {
        return { message: 'hello' }
      }
    },
    // Пользовательская функция для валидации
    propF: {
      validator: function (value) {
        // Значение должно соответствовать одной из этих строк
        return ['success', 'warning', 'danger'].indexOf(value) !== -1
      }
    }
  }
})
```

Когда валидация входного параметра заканчивается ошибкой — Vue выдаст предупреждение в консоли (если используется сборка для разработки).

Входные параметры валидируются **перед** созданием экземпляра компонента, поэтому свойства экземпляра (например, `data`, `computed` и т.д.) не будут доступны внутри `default` или функций `validator`.

## Проверка типа

Значением `type` может быть один из следующих нативных конструкторов:

* String
* Number
* Boolean
* Array
* Object
* Date
* Function
* Symbol

Кроме того, `type` также может быть пользовательской функцией-конструктором и валидация будет выполняться проверкой с помощью `instanceof`. Например, если существует следующая функция-конструктор:

```javascript
function Person (firstName, lastName) {
  this.firstName = firstName
  this.lastName = lastName
}
```

Вы можете использовать:

```javascript
Vue.component('blog-post', {
  props: {
    author: Person
  }
})
```

чтобы проверить, что значение входного параметра `author` было создано с помощью `new Person`.
