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" // 修改标签里面的颜色