vue.js中如何獲取某個dom元素的值

發(fā)布時間：2020-12-10 10:41:05 來源：億速云閱讀：601 作者：小新欄目：編程語言

這篇文章主要介紹了vue.js中如何獲取某個dom元素的值，具有一定借鑒價值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

vue.js獲取某個dom元素值的方法：1、在【vue.js1.0】版本可以通過【v-el】來取得dom元素；2、在【Vue.js2.0】版本使用ref屬性來標(biāo)識一個元素。

vue.js獲取某個dom元素值的方法：

1、vue.js1.0版本

可以通過：v-el 來取得dom元素

例如：

html代碼：

<input type="text" name="xxx" id="xxx" v-el:sxx />
            <button @click="ok()">確定</button>

js代碼：

var vm = new Vue({
    el: '#app',
    methods: {
        ok() {
           var xx = this.$els.sxx.value;
           console.log(xx);
        }
    }
});

結(jié)果：

vue.js中如何獲取某個dom元素的值

2、Vue.js2.0版本

Vue.js 2.0使用了 ref 替換掉了 v-el和v-ref，使用 ref 屬性來標(biāo)識一個元素。 .

我們寫的時候就變成了

<input type="text" name="xxx" id="xxx" ref='sxx' />
<button @click="ok()">確定</button>

調(diào)用時還是一樣的

var vm = new Vue({
    el: '#app',
    methods: {
        ok() {
           var xx = this.$refs.sxx.value;
           console.log(xx);
        }
    }
});

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享vue.js中如何獲取某個dom元素的值內(nèi)容對大家有幫助，同時也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問題就找億速云，詳細(xì)的解決方法等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

vue.js中如何獲取某個dom元素的值

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽