Vuejs 2

Cheatsheet

Components understanding:

Preventing easy:

    <a href="#" @click.prevent="toDo();"></a>

Easy event handling:

    <button @click.ctrl="onClick">A</button>

    <button @click.ctrl.exact="onCtrlClick">A</button>

Prop validation:

    Vue.component('example', {
      props: {
        // basic type check (`null` means accept any type)
        propA: Number,
        // multiple possible types
        propB: [String, Number],
        // a required string
        propC: {
          type: String,
          required: true
        },
        // a number with default value
        propD: {
          type: Number,
          default: 100
        },
        // object/array defaults should be returned from a
        // factory function
        propE: {
          type: Object,
          default: function () {
            return { message: 'hello' }
          }
        },
        // custom validator function
        propF: {
          validator: function (value) {
            return value > 10
          }
        }
      }
    })

Mixins:

require('myapp-bootstrap');

require('./components/bootstrap');

var app = new Vue({
    mixins: [require('myapp')]
});


module.exports = {
    el: '#myapp-app',

    /**
     * The application's data.
     */
    data: {

    },
}

@blog