filters

filters Type: Object Details: A hash of filters to be made available to the Vue instance. See also: Custom Filters Assets Naming Convention

partials

partials Type: Object Details: A hash of partial strings to be made available to the Vue instance. See also: Special Elements - partial

name

name Type: String Restriction: only respected when used in Vue.extend(). Details: Allow the component to recursively invoke itself in its template. Note that when a component is registered globally with Vue.component(), the global ID is automatically set as its name. Another benefit of specifying a name option is console inspection. When inspecting an extended Vue component in the console, the default constructor name is VueComponent, which isn’t very informative. By passing in an optional

debug

debug Type: Boolean Default: false Usage: Vue.config.debug = true When in debug mode, Vue will: Print stack traces for all warnings. Make all anchor nodes visible in the DOM as Comment nodes. This makes it easier to inspect the structure of the rendered result. Debug mode is only available in development build.

v-el

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

debounce

debounce Limited to: directives that expect Function values, e.g. v-on Arguments: {Number} [wait] - default: 300 Usage: Wrap the handler to debounce it for x milliseconds, where x is the argument. Default wait time is 300ms. A debounced handler will be delayed until at least x ms has passed after the call moment; if the handler is called again before the delay period, the delay period is reset to x ms. Example: <input @keyup="onKeyup | debounce 500">

v-pre

v-pre Does not expect expression Usage Skip compilation for this element and all its children. You can use this for displaying raw mustache tags. Skipping large numbers of nodes with no directives on them can also speed up compilation. Example: <span v-pre>{{ this will not be compiled }}</span>

compiled

compiled Type: Function Details: Called after the compilation is finished. At this stage all directives have been linked so data changes will trigger DOM updates. However, $el is not guaranteed to have been inserted into the document yet. See also: Lifecycle Diagram

vm.$mount()

vm.$mount( [elementOrSelector] ) Arguments: {Element | String} [elementOrSelector] Returns: vm - the instance itself Usage: If a Vue instance didn’t receive the el option at instantiation, it will be in “unmounted” state, without an associated DOM element or fragment. vm.$mount() can be used to manually start the mounting/compilation of an unmounted Vue instance. If no argument is provided, the template will be created as an out-of-document fragment, and you will have to use other DOM inst

List Rendering

v-for We can use the v-for directive to render a list of items based on an Array. The v-for directive requires a special syntax in the form of item in items, where items is the source data Array and item is an alias for the Array element being iterated on: Example: <ul id="example-1"> <li v-for="item in items"> {{ item.message }} </li> </ul> var example1 = new Vue({ el: '#example-1', data: { items: [ { message: 'Foo' }, { message: 'Bar' }