Vue.js — Expected Boolean, got String with value «true»

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

Invalid prop: type check failed for prop «xxx». Expected Boolean, got String with value «true».

Рассмотрим на примере свойства isActive. Объявление переменной будет выглядеть следующим образом

export default {
  props: {
    isActive: {
      type: Boolean,
      default: false
    },
 }
}Code language: JavaScript (javascript)

Неверная установка переменной типа boolean в Vue.js

<template>
 <div>
    <custom-component isActive=true />
    <custom-component isActive="true" />
 </div>
</template>Code language: HTML, XML (xml)

Правильное использование

<template>
 <div>
    <custom-component isActive />
    <custom-component :isActive="true" />
 </div>
</template>Code language: HTML, XML (xml)

Добавить комментарий