Presentantion Vue.js - EasyRetro

vue.md

Vue overview

The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects

Ecosystem

• Devtools
• Vue CLI
• Vue Loader
• Vue Router
• Vuex
• Vue SSR

Vue instance

<div id="app">
  {{ message }}
</div>

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})

Result:

Components

Components are reusable Vue instances with a name

new Vue({
  el: '#app',
  components: {
    'component-a': ComponentA,
    'component-b': ComponentB
  }
})

// or 


Vue.component('component-c', { /* ... */ })

Options

Assets

• directives
• filters
• components

Lifecycle

• beforeCreate
• created
• beforeMount
• mounted
• beforeUpdate
• updated
• activated
• deactivated
• beforeDestroy
• destroyed
• errorCaptured

Data

• data
• props
• propsData
• computed
• methods
• watch