v-else Does not expect expression Restriction: previous sibling element must have v-if or v-show. Usage: Denote the “else block” for v-if and v-show. <div v-if="Math.random() > 0.5"> Sorry </div> <div v-else> Not sorry </div> See also: Conditional Rendering - v-else See also: Conditional Rendering - Component caveat

v-el Does not expect expression Argument: id (required) Usage: Register a reference to a DOM element on its owner Vue instance’s $els object for easier access. Note: Because HTML is case-insensitive, camelCase usage like v-el:someEl will be converted to all lowercase. You can use v-el:some-el which properly sets this.$els.someEl. Example: <span v-el:msg>hello</span> <span v-el:other-msg>world</span> this.$els.msg.textContent // -> "hello" this.$els.otherMsg.t

v-cloak Does not expect expression Usage: This directive will remain on the element until the associated Vue instance finishes compilation. Combined with CSS rules such as [v-cloak] { display: none }, this directive can be used to hide un-compiled mustache bindings until the Vue instance is ready. Example: [v-cloak] { display: none; } <div v-cloak> {{ message }} </div> The <div> will not be visible until the compilation is done.

v-bind Shorthand: : Expects: * (with argument) | Object (without argument) Argument: attrOrProp (optional) Modifiers: .sync - make the binding two-way. Only respected for prop bindings. .once - make the binding one-time. Only respected for prop bindings. .camel - convert the attribute name to camelCase when setting it. Only respected for normal attributes. Used for binding camelCase SVG attributes. Usage: Dynamically bind one or more attributes, or a component prop to an expression.

uppercase Example: {{ msg | uppercase }} ‘abc’ => ‘ABC’

unsafeDelimiters Type: Array<String> Default: ["{{{", "}}}"] Usage: // make it look more dangerous Vue.config.unsafeDelimiters = ['{!!', '!!}'] Change the raw HTML interpolation delimiters.

transitions Type: Object Details: A hash of transitions to be made available to the Vue instance. See also: Transitions

With Vue.js’ transition system you can apply automatic transition effects when elements are inserted into or removed from the DOM. Vue.js will automatically add/remove CSS classes at appropriate times to trigger CSS transitions or animations for you, and you can also provide JavaScript hook functions to perform custom DOM manipulations during the transition. To apply transition effects, you need to use the special transition attribute on the target element: <div v-if="show" transition="my-tr

Constructor Every Vue.js app is bootstrapped by creating a root Vue instance with the Vue constructor function: var vm = new Vue({ // options }) A Vue instance is essentially a ViewModel as defined in the MVVM pattern, hence the variable name vm you will see throughout the docs. When you instantiate a Vue instance, you need to pass in an options object which can contain options for data, template, element to mount on, methods, lifecycle callbacks and more. The full list of options can be fou

template Type: String Details: A string template to be used as the markup for the Vue instance. By default, the template will replace the mounted element. When the replace option is set to false, the template will be inserted into the mounted element instead. In both cases, any existing markup inside the mounted element will be ignored, unless content distribution slots are present in the template. If the string starts with # it will be used as a querySelector and use the selected element’s