码迷,mamicode.com
首页 > 其他好文 > 详细

Vue 实例

时间:2016-08-09 14:51:17      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:

1. Vue 实例

  1.1 构造器

    var vm = new Vue({

      // data

    });

  1.2 属性和方法

    

var data = { a: 1 }
var vm = new Vue({
  data: data
})

vm.a === data.a // -> true

// 设置属性也会影响到原始数据
vm.a = 2
data.a // -> 2

// ... 反之亦然
data.a = 3
vm.a // -> 3

  Vue 实例暴露了一些有用的实例属性与方法。这些属性与方法都有前缀$,以便与代理的数据属性区分

var data = { a: 1 }
var vm = new Vue({
  el: ‘#example‘,
  data: data
})

vm.$data === data // -> true
vm.$el === document.getElementById(‘example‘) // -> true

// $watch 是一个实例方法
vm.$watch(‘a‘, function (newVal, oldVal) {
  // 这个回调将在 `vm.a`  改变后调用
})

  1.3 实例的什么周期

    created 钩子在实例创建后调用

    

var vm = new Vue({
  data: {
    a: 1
  },
  created: function () {
    // `this` 指向 vm 实例
    console.log(‘a is: ‘ + this.a)
  }
})
// -> "a is: 1"

    钩子的 this 指向调用它的 Vue 实例。一些用户可能会问 Vue.js 是否有“控制器”的概念?答案是,没有。组件的自定义逻辑可以分割在这些钩子中。

  

Vue 实例

标签:

原文地址:http://www.cnblogs.com/quadrant/p/5753120.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!