vue

vue实例的属性和方法

var vm=new Vue({

// el:'#itany',

data:{

msg:'welcome to itany'

},

name:'tom',

age:24,

show:function(){

console.log('show');

}

});

属性    vm.属性名 获取data中的属性

console.log(vm.msg);  //在外面打印出来属性

vm.$el    获取vue实例关联的元素

console.log(vm.$el);//DOM对象

vm.$el.style.color='red';

vm.$data  //获取数据对象data

console.log(vm.$data);

console.log(vm.$data.msg);

vm.$options//获取自定义属性.方法

console.log(vm.$options.name);

console.log(vm.$options.age);

vm.$options.show();

vm.$refs 获取所有添加ref属性的元素

console.log(vm.$refs);

console.log(vm.$refs.hello);   //DOM对象

vm.$refs.hello.style.color='blue';

vm.$refs.hello      //获取一个标签  和需要在页面上定义ref="hello"

vm.$refs.hello.textContent     //获取标签里面的文本（如果去获取修改了过后的值，是获取不了的）

//DOM还没更新完，Vue实现响应式并不是数据发生改变之后DOM立即变化，需要按一定的策略进行DOM更新，需要时间！！

vm.$nextTick(function(){

      //DOM更新完成，更新完成后再执行此代码

console.log(vm.$refs.title.textContent);

});

vm.$refs.hello.style.color="blue"  // 修改标签里面的颜色