Vue中获取Dom节点,建议不要使用,最好用v-model进行双向数据绑定

    <div id="people_list">
        <ul>
            <li>姓 名:<input type="text" id="username" /></li>
            <li>年 龄:<input type="text" ref="age" /></li>           
        </ul>
        <button @click="doSubmit">获取表单的内容</button>
    </div>
    <script type="text/javascript">
        var vue = new Vue({
            el: "#people_list",
            data: {
             
            },
            methods: {
                doSubmit: function () {
                    //原生js尽量不要用dom
                    var usernameObj = document.querySelector("#username");//1获取dom节点的两种方法
                    alert(usernameObj.value);
                    alert(this.$refs.age.value);//2获取dom节点的两种方法
                }
            }
        })
    </script>

 

posted @ 2021-06-17 17:32  shui~  阅读(255)  评论(0)    收藏  举报