This is a set of handy validators for Vue.js.
npm install vue-properties
import {oneOf} from 'vue-properties';
export default {
props: {
size: {
type: String,
validator: oneOf('large', 'medium', 'small')
}
}
}
import {regex} from 'vue-properties';
export default {
props: {
field: {
type: String,
validator: regex(/[A-Z][a-z]+/)
}
}
}
import {range, between} from 'vue-properties';
export default {
props: {
percentage: {
type: Integer,
validator: range(0, 100)
},
teen: {
type: Integer,
validator: between(0, 20)
}
}
}
💡 range()
is inclusive (so 0
and 100
also match). between()
is exclusive, so 0
and 20
don't match.
import {smallerThan, biggerThan} from 'vue-properties';
export default {
props: {
canDrink: {
type: Integer,
validator: biggerThan(18)
},
negative: {
type: Integer,
validator: smallerThan(0)
}
}
}
import {structure} from 'vue-properties';
export default {
props: {
options: {
type: Object,
validator: structure({
color: String,
amount: Integer
})
}
}
}
import {structure} from 'vue-properties';
export default {
props: {
users: {
type: Object,
validator: structure([
{
id: Integer,
name: String,
shopCartItems: [
{
itemId: Integer,
itemName: String
}
]
}
])
}
}
}