ホームページ > 記事 > ウェブフロントエンド > vue.jsで特定のdom要素の値を取得する方法
Vue.js で特定の dom 要素の値を取得する方法: 1. [vue.js1.0] バージョンでは、[v-el] を通じて dom 要素を取得できます; 2. [ Vue.js2.0] ] バージョンでは、要素を識別するために ref 属性を使用します。
このチュートリアルの動作環境: Windows10 システム、vue2.5.2、この記事はすべてのブランドのコンピューターに適用されます。
[おすすめ関連記事: vue.js]
vue.js で DOM 要素の値を取得する方法:
1、vue.js1.0 バージョン
次の方法で dom 要素を取得できます: v-el
例:
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); } } });
結果:
2、Vue.js2.0 バージョン
Vue.js 2.0 では、ref を使用して v-el と v-ref を置き換え、ref 属性を使用して要素を識別します。 .
書くと
<input type="text" name="xxx" id="xxx" ref='sxx' /> <button @click="ok()">确定</button>になります
var vm = new Vue({ el: '#app', methods: { ok() { var xx = this.$refs.sxx.value; console.log(xx); } } });呼び出しても同じままです
rrreee###関連する無料学習の推奨事項: JavaScript
(ビデオ)
以上がvue.jsで特定のdom要素の値を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。