2,466
edits
Changes
Jump to navigation
Jump to search
===Component templates===
* Computed property - double mustache inside the component template
* Components have templates, script, and styling
* <code>export default { props: ['id, 'age', 'weight] }</code>
no edit summary
==Vue.js==
===Files===
* index.html has <code><div id="app"</code> and script includes main.js
* main.js - contains instantiation of Vue instance
* App.vue - top level component into which we compose other components * App-level arg array contains:** <code>const app = new Vue({ el: "#app" } )<code> - el stands for element, maps back to the div in index.html ** data** computed - contains methods. One-off computations in our dataset. Get access to the data using $this** filters - also contains methods that take arguments. Pass arguments to filter method inside the mustache using the pipe separator** methods - can take an argument** lifecycle methods*** beforeCreate*** mounted() fires when your app attaches to the DOM, a good time to fetch some data*** beforeDestroy()
* router/index.js
===Directives===
* directive inside HTML tags start with v-
* <code>v-on:click="someMethod"</code> - binds a function to button
* <code><input v-model="message"></code> - direct two-way binding between input and app state
===Component===
* How you create a new HTML tag, you must register them
* Template can only return one top level element, if you need to return two, wrap within a div.
*
* Computed property - double mustache inside the component template
* Components have templates, script, and styling
* <code>export default { props: ['id, 'age', 'weight] }</code>
** name = "component_name"
** components: [ subcomponent1, subcomponent2 ]
* <code><style scoped></code>
===Vue Instance===
==Vuex==
