this ts 方法获取_vue+typescript项目中用this.$refs和原生方法获取的dom有什么区别

项目中使用vue+typescript

使用this.$refs.refsName和document.querySelector打印出来的结果是一样的

但是当使用API是。$refs获得的DOM就报错:请问是需要在ts项目中添加什么ts相关的配置吗?

Property 'getBoundingClientRect' does not exist on type 'Vue | Element | Vue[] | Element[]'.

Property 'getBoundingClientRect' does not exist on type 'Vue'.

any

let el = this.$refs.refsName

console.log('el:', el);

let element = document.querySelector('.content-box')

console.log('element:', el);

console.log(element['style'].width)

// 1.element 调用API正常

console.log(window.getComputedStyle(element).width)

console.log(element.getBoundingClientRect())

// 2.el 调用报错

// Property 'getBoundingClientRect' does not exist on type 'Vue | Element | Vue[] | Element[]'.Property 'getBoundingClientRect' does not exist on type 'Vue'.any

// console.log(el.getBoundingClientRect())

// console.log(window.getComputedStyle(el).width)

知道了,要把let el = this.$refs.refsName改为:let el: any = this.$refs.refsName,定义一个类型


版权声明:本文为weixin_39636099原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。