Javascript Vue组件道具的默认值&；如何检查用户是否未设置道具？

1。如何设置Vue 2中组件道具的默认值？例如，有一个简单的

movies

组件可以这样使用：

<movies year="2016"><movies>



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

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

然后，该组件将为

年份

属性获取一些默认值

2.此外，检查用户是否未设置道具的最佳方法是什么？这是一个好方法：

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

或者可能是这样：

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

---

？

Vue

允许您通过将道具设置为对象，直接指定默认的

道具值和
类型（请参见：）：

如果传递了错误的类型，那么它会抛出一个错误并将其记录在控制台中，这里是fiddle：

这是一个老问题，但是关于问题的第二部分-如何检查用户是否设置了/没有设置道具

检查组件中的
this
，我们有
this.$options.propsData
。如果这里有道具，则用户已明确设置道具；默认值不显示

这在无法将值与其默认值进行比较的情况下非常有用，例如，如果道具是一个函数。
这里还需要添加一些重要内容，为了设置数组和对象的默认值，我们必须使用道具的默认函数：

propE: {
      type: Object,
      // Object or array defaults must be returned from
      // a factory function
      default: function () {
        return { message: 'hello' }
      }
    },

第二个问题呢（这是一个JavaScript问题）：检查用户是否未设置道具的最佳方法是什么？这是一个好方法：
if（this.year！=null）
或者可能是这样：
if（！this.year）
或者？谢谢如果设置默认值，除非将默认值设置为
null
，否则将始终设置道具。如果这是您需要执行的其他逻辑
If（this.year！=null）
或
If（！this.year）
是一种方法。
props: {
  year: {
    default: 2016,
    type: Number
  }
}

propE: {
      type: Object,
      // Object or array defaults must be returned from
      // a factory function
      default: function () {
        return { message: 'hello' }
      }
    },