vue獲取dom元素與修改樣式詳解

vue中如何獲取dom元素呢？

步驟詳解

1. 在標籤上加上ref屬性 如 ：
2. 在js中通過 this.$refs.加ref的值便可以獲取dom 如：this.$refs.refDemo
3. 修改對應的樣式名 如：this.$refs.refDemo.style.backgroundColor="#108ee9"
   下面是代碼例子

<template>
 
  <div class="demo" ref="refDemo">
  	這是一個測試demo
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data(){
	  return{}
  },
  mounted() {
    //查看可以修改的所有css屬性
  	console.log(this.$refs.refDemo.style)
  	 //按業務要求修改屬性名
  	this.$refs.refDemo.style.backgroundColor="#108ee9"
  	this.$refs.refDemo.style.height="80px"
  	this.$refs.refDemo.style.lineHeight="80px"
  	this.$refs.refDemo.style.color="#fff"
  	
 //還不會？請加羣 897149839
	
  },
  methods:{
	  
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
 
</style>