Vue コンポーネントのプロパティのデフォルト値と、ユーザーがプロパティを設定していないかどうかを確認する方法は? 質問する

Vue コンポーネントのプロパティのデフォルト値と、ユーザーがプロパティを設定していないかどうかを確認する方法は? 質問する

1.Vue 2 でコンポーネント プロパティのデフォルト値を設定するにはどうすればよいですか? たとえば、movies次のように使用できる単純なコンポーネントがあります。

<movies year="2016"><movies>



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

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

ただし、ユーザーが以下を指定しない場合はyear

<movies></movies>

すると、コンポーネントはyearプロパティのデフォルト値を取得します。

2.また、ユーザーがプロパティを設定していないかどうかを確認する最良の方法は何ですか? これは良い方法でしょうか:

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

あるいはこれかもしれません:

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

?

ベストアンサー1

Vueprops をオブジェクトにすることでprop、デフォルト値を直接指定できます(参照:typehttps://vuejs.org/guide/components.html#プロパティ検証):

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

間違った型が渡された場合はエラーがスローされ、コンソールにログが記録されます。以下に例を示します。

https://jsfiddle.net/cexbqe2q/

おすすめ記事