vue中如何獲取dom元素呢?
步驟詳解
- 在標籤上加上ref屬性 如 :
- 在js中通過
this.$refs.加ref的值
便可以獲取dom 如:this.$refs.refDemo - 修改對應的樣式名 如: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>