vue-properties

Vue.js properties

npm install vue-properties

Allowing a string to be one of a set

import {oneOf} from 'vue-properties';

export default {
    props: {
        size: {
            type: String, 
            validator: oneOf('large', 'medium', 'small')
        }
    }
}

Matching a property by regular expression

import {regex} from 'vue-properties';

export default {
    props: {
        field: {
            type: String, 
            validator: regex(/[A-Z][a-z]+/)
        }
    }
}

Checking whether an integer is between two numbers

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.

Checking whether an integer is smaller or greater

import {smallerThan, biggerThan} from 'vue-properties';

export default {
    props: {
        canDrink: {
            type: Integer, 
            validator: biggerThan(18)
        },
        negative: {
            type: Integer,
            validator: smallerThan(0)
        }
    }
}

This is a set of handy validators for Vue.js.

Tests (Command Line)

To run vue-properties unit tests just type:

npm test

It will stay in watch mode, and whenever you edit test files or source files, the tests will run again, automatically.

Tests (PhpStorm/WebStorm)

Before you run tests from IDE, you must go to Settings, Plugins and install Karma plugin.

• Go to any file (like StringsTest.js)
• Right click
• From context menu choose "Run StringsTest.js"

If you want to run all tests:

• Right click on karma.conf.js
• From context menu choose "Run karma.conf.js"