Content deleted Content added
Nonokunono (talk | contribs) |
Nonokunono (talk | contribs) |
||
Line 44:
=== Components ===
Components are one of the most powerful features of Vue. In a large application, it is necessary to divide the whole app into small, self-contained, and often reusable components to make development manageable. Components extend basic [[HTML element|HTML elements]] to encapsulate reusable code. At a high level, components are custom elements that Vue’s compiler attaches behavior to. In Vue, a component is essentially a Vue instance with pre-defined options.<ref>{{Cite web|url=https://vuejs.org/v2/guide/components.html|title=Components — Vue.js|access-date=2017-03-11|language=en}}</ref>
An example of Vue component. The component presents a button and prints of the number of times the button is clicked :
<pre>
Vue.component('buttonclicked', {
props: ["initial_count"],
data: function() {var q = {"count": 0}; return q;} ,
template: '<div><button v-on:click="onclick">Click</button> has been clicked {{count}} times.</div>'
,
methods: {
"onclick": function() {
this.count = this.count + 1;
}
},
mounted: function() {
this.count = this.initial_count;
}
};
</pre>
=== Transitions ===
| |||