vue中通过事件获取元素的值

vue中通过事件获取元素的值

原生js获取值

<template>
 <div>
    <ul>
        <li>姓名： <input type="text" id="name" /></li>
    </ul>
    <button @click="doSubmit()" class="submit">获取表单的内容</button>
</div>
</template>

    doSubmit(){
      var name = document.querySelector("#name");
            alert(name.value);
    },

2、ref获取dom节点

<template>
 <div>
    <ul>
        <li>年龄： <input type="text" ref="age" /></li>
       
    </ul>
    <button @click="doSubmit()" class="submit">获取表单的内容</button>
</div>
</template>

    doSubmit(){
            var ageDom = this.$refs.age;
            alert(ageDom.value);
    },

3、事件方法带参

<template>
 <div>
    <ul>
        <a @click="addLikes($event)" id="sex">点击</a>
    </ul>
</div>
</template>

 addLikes: function(event){
         alert(event.currentTarget.id);
   },