Ian Davis
Ian Davis

Reputation: 19413

Vue component define some of the props as data type, leave others as-is

I really like the syntax props: ['title', 'someInt', 'description'] in my Vue component. How do I require just 1 of those props, namely someInt, to be an integer? But without having to explicitly define the data types for the other props (they can remain default as String).

My parent component is doing <my-component title='some title' some-int='100' description='desc'></my-component> and later when I do this.someInt it's of datatype String not integer (Number). Thanks!

Upvotes: 0

Views: 179

Answers (1)

Ian Davis
Ian Davis

Reputation: 19413

You can keep the props: ['title', 'someInt', 'description'] syntax if you updated your <my-component to use binding for the properties you want as Numbers. Example:

<my-component title='some title' :some-int='100' description='desc'></my-component> - that will make someInt come thorugh as a Number since you're binding it via the : character. Vue parses the expression literally.

Upvotes: 1

Related Questions