vue $refs的基本用法


<div id="app">
    <input type="text" ref="input1"/>
    <button @click="add">添加</button>
</div>
<script>
new Vue({
    el: "#app",
    methods:{
    add:function(){
        this.$refs.input1.value ="22"; //this.$refs.input1  減少獲取dom節點的消耗
        }
    }
})
</script>

一般來講,獲取DOM元素,需document.querySelector(".input1")獲取這個dom節點,然后在獲取input1的值。

但是用ref綁定之后,我們就不需要在獲取dom節點了,直接在上面的input上綁定input1,然后$refs里面調用就行。

然后在javascript里面這樣調用:this.$refs.input1  這樣就可以減少獲取dom節點的消耗了

打賞

免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2022 CODEPRJ.COM