vue中$el等属性

本文详细介绍了Vue实例的几个关键属性:$el用于获取关联的DOM元素,$data用于访问数据对象,$options提供了自定义属性的访问途径,而$refs则用于获取带有ref属性的DOM元素。通过示例代码展示了如何使用这些属性进行实际操作。
摘要由CSDN通过智能技术生成

属性:

vm.$el

获取Vue实例关联的DOM元素;

vm.$data

获取Vue实例的data选项(对象)

vm.$options

获取Vue实例的自定义属性(如vm.$options.methods,获取Vue实例的自定义属性methods)

vm.$refs

获取页面中所有含有ref属性的DOM元素(如vm.$refs.hello,获取页面中含有属性ref = “hello”的DOM元素,如果有多个元素,那么只返回最后一个)

Js代码

var app   = new Vue({    
        el:"#container",    
        data:{    
                msg:"hello,2018!"    
        },    
        address:"长安西路"    
})    

console.log(app.$el);

返回Vue实例的关联DOM元素,在这里是#container

console.log(app.$data);

返回Vue实例的数据对象data,在这里就是对象{msg:”hello,2018“}

console.log(app.$options.address);

返回Vue实例的自定义属性address,在这里是自定义属性address

console.log(app.$refs.hello)

返回含有属性ref = hello的DOM元素(如果多个元素都含有这样的属性,只返回最后一个)<h3 ref = "hello">呵呵 1{{msg}}</h3>

转载:https://forlan.iteye.com/blog/2418359

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值