vue.js 怎么获取某个 dom 元素的值? 下面本篇文章给大家介绍一下 vue.JS 获取某个 dom 元素值的方法. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
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);
- }
- }
- });
结果:
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);
- }
- }
- });
更多 web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/vue-js/17211.html