在vue中可以通过给标签加ref属性,就可以在js中利用ref去引用它,从而达到操作该dom元素,以下是个参考例子

 1 <template>
 2 <div>
 3 <div >
 4 DEMO
 5 </div>
 6 </div>
 7 </template>
 8 
 9 <script>
10 export default {
11 data () {
12   return {
13 
14 }
15 },
16 mounted () {
17   this.init();
18 },
19 methods:{
20  init() {
21   const self = this;
22   this.$refs.mybox.style.color = 'red';
23   setTimeout(() => {
24     self.$refs.mybox.style.color = 'blue';
25   },2000)
26 }
27 }
28 
29 }
30 </script>
31 
32 <style scoped>
33 #box {
34 width: 100px;
35 height: 100px;
36 line-height: 100px;
37 text-align: center;
38 border: 1px solid black;
39 margin: 50px; 
40 color: yellow;
41 }
42 </style>

 

分类:

技术点:

相关文章: