Vue.

js

#vue.js
Table of Contents
About 1

Chapter 1: Getting started with Vue.js 2

Remarks 2

Versions 2

Examples 2

"Hello, World!" Program 2

Simple Example 2

HTML template 3

JavaScript 3

Hello World in Vue 2 (The JSX way) 3

Handling User Input 4

Chapter 2: Components 5

Remarks 5

Examples 5

Component scoped (not global) 5

HTML 5

JS 5

What are components and how to define components? 6

Local registration of components 9

Inline registration 9

Data registration in components 9

Events 10

Chapter 3: Computed Properties 11

Remarks 11

Data vs Computed Properties 11

Examples 11

Basic Example 11

Computed properties vs watch 12

Computed Setters 12

Using computed setters for v-model 13

Syntax 16

Remarks 16

Examples 16

Overview 16

v-if 16

v-else 16

v-show 16

v-if / v-else 16

v-show 18

Chapter 5: Custom Components with v-model 19

Introduction 19

Remarks 19

Examples 19

v-model on a counter component 19

Chapter 6: Custom Directives 21

Syntax 21

Parameters 21

Examples 21

Basics 21

Chapter 7: Custom Filters 25

Syntax 25

Parameters 25

Examples 25

Two-way Filters 25

Basic 26

Chapter 8: Data Binding 27

Examples 27

Text 27

Raw HTML 27

Attributes 27
 Filters 27

Chapter 9: Dynamic Components 29

Remarks 29

Examples 29

Simple Dynamic Components Example 29

Javascript: 29

HTML: 29

Snippet: 29

Pages Navigation with keep-alive 30

Javascript: 30

HTML: 31

CSS: 31

Snippet: 31

Chapter 10: Event Bus 32

Introduction 32

Syntax 32

Remarks 32

Examples 32

eventBus 32

Chapter 11: Events 34

Examples 34

Events syntax 34

When should I use events ? 34

The example above can be improved ! 36

How to deal with deprecation of $dispatch and $broadcast? (bus event pattern) 37

Chapter 12: Lifecycle Hooks 39

Examples 39

Hooks for Vue 1.x 39

init 39

created 39

beforeCompile 39
 compiled 39

ready 39

attached 39

detached 39

beforeDestroy 39

destroyed 39

Using in an Instance 40

Common Pitfalls: Accessing DOM from the `ready()` hook 40

Chapter 13: List Rendering 42

Examples 42

Basic Usage 42

HTML 42

Script 42

Only render HTML items 42

Pig countdown list 42

Iteration over an object 43

Chapter 14: Mixins 44

Examples 44

Global Mixin 44

Custom Option Merge Strategies 44

Basics 44

Option Merging 45

Chapter 15: Modifiers 47

Introduction 47

Examples 47

Event Modifiers 47

Key Modifiers 47

Input Modifiers 48

Chapter 16: Plugins 49

Introduction 49

Syntax 49

Parameters 49
Click here to download full PDF material