Значения по умолчанию для реквизита компонента Vue и как проверить, не установил ли пользователь опору?

1. Как установить значение по умолчанию для поддержки компонента в Vue 2? Например, существует простой компонент movies, который можно использовать следующим образом:

<movies year="2016"><movies>



Vue.component('movies', {
    props: ['year'],

    template: '#movies-template',
    ...
}

Но если пользователь не указывает year:

<movies></movies>

тогда компонент примет значение по умолчанию для year prop.

2.. Каков наилучший способ проверить, не установил ли пользователь опору? Это хороший способ:

if (this.year != null) {
    // do something
}

или, может быть, это:

if (!this.year) {
    // do something
}

Ответ 1

Vue позволяет вам указать значение по умолчанию prop и type напрямую, создав реквизит объекта (см. https://vuejs.org/guide/components.html#Prop-Validation):

props: {
  year: {
    default: 2016,
    type: Number
  }
}

Если ошибочный тип передается, он выдает сообщение об ошибке и записывает его в консоль, здесь скрипка:

https://jsfiddle.net/cexbqe2q/

Ответ 2

Это старый вопрос, но касающийся второй части вопроса - как вы можете проверить, не установил ли пользователь/не установил опору?

Проверяя this внутри компонента, имеем this.$options.propsData. Если здесь присутствует опорная точка, пользователь явно установил ее; значения по умолчанию не отображаются.

Это полезно в тех случаях, когда вы не можете сравнить свое значение с его значением по умолчанию, например. если prop является функцией.