vue获取dom元素|Vue获取DOM元素样式和样式更改示例

时间:2021-07-12  来源:Dom教程  阅读:

在 vue 中用 document 获取 dom 节点进行节点样式更改的时候有可能会出现 'style' is not definde的错误,这时候可以在 mounted 里用 $refs 来获取样式,并进行更改:

 

 代码如下

<script>

  exportdefault{

   mounted () {

     console.log(this.$refs.abc.style.cssText)

   }

  }

</script>

 

结果是 display: block;

如果我们给一个div设定全屏背景图,就需要获取屏幕高度进行赋值:

 

 代码如下

 

<script>

exportdefault{

 mounted () {

 

 

   let w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;

   let h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

 

  this.$refs.nana.style.height = h +'px';

 

  }

 

}

 

</script>

 

vue获取dom元素|Vue获取DOM元素样式和样式更改示例

http://m.bbyears.com/wangyezhizuo/129268.html

推荐访问:vue虚拟dom vue虚拟dom原理
相关阅读 猜你喜欢
本类排行 本类最新