vue2 ref17 $refs 操控dom

标签：cont ref17 dom refs log vue2 console methods

在vue中不建议安装jquery

在vue中操控dom可以用ref方法

 每一个ref对象中都包含一个$refs对象，组件的$refs对象都指向一个空对象

<button @click="clg" class="red">打印</button>

methods: {     clg(){       console.log(this);     },   },

　　

 

 

 ref操控dom

<h1 ref="my">111</h1>

clg(){       console.log(this);       console.log(this.$refs.my);       this.$refs.my.style.color = 'red'     },     案例： 子： <p ref="reset">值：{{cont}}</p> <button @click="jia">+1</button>   data() {     return {       cont:0,     }   },   methods: {     jia(){       this.cont += 1     },   },   父： <hello ref="com" @fromCount="getCount"></hello>  <button @click="reset">重置</button>   import hello from '@/components/HelloWorld.vue'   methods: {     reset(){       this.$refs.com.cont = 0     },   },       按需填写案例：     <input type="text" placeholder="999感冒灵" v-if="inputVi" @blur="showinpu" autofocus>     <button v-else @click="inpu">展示</button>   data() {     return {       inputVi: false,     }   },   methods: {     inpu() {       this.inputVi = true     },     showinpu() {       this.inputVi = false     },   },    

标签：cont,ref17,dom,refs,log,vue2,console,methods
From： https://www.cnblogs.com/wencaiguagua/p/16935545.html