四.点击按钮使用

<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <!-- 事件和方法 -->
    
      <button @click="getList()"> 点击渲染list列表</button>
        <ul>
      <li v-for="item in list" :key="item">
        {{item}}
      </li>
    </ul>
    <br />

    <button @click="deleteData(111)">执行方法传值</button>

        <button data-aid='123'  ref="getda"  @click="eventFn($event)">事件对象</button>

  </div>



</template>

<script>
export default {
  data() {
    return {
      msg: "Welcome to Your Vue.js App",
      list:[]
     
    }
    },
    methods: {
   
      getList(){
         for(var i=0;i<10;i++){
            this.list.push("我是第"+i+"条数据")
         }
      },
      deleteData(val){
         alert(val);
      },
      eventFn(e){
        console.log(e.srcElement.dataset.aid);
       
      }
    }
  

};
</script>

<style scoped>


</style>