首页 > 其他 > 详细

vue的事件对象,方法执行

时间:2019-04-21 22:54:54      阅读:116      评论:0      收藏:0      [点我收藏+]

方法都写在methods重,有两种写法:
1、

getMsg:function(){
alert();
},  这种写法就是对象中的方法
2、
getMsg1(){

alert();
}注意没有function,否则报错

对于view上面的事件有两种方式定义: v-on:click="""这种方式

或者@click这种写法

 

----------------

实现一个功能:当点击请求数据按钮时,会将数据赋值

技术分享图片

<template>
  <div id="app">
{{msg}}
<br>
  <button v-on:click="getMsg()">获取 </button>
  <button @click="getMsg1()">获取1</button>

  <button @click="requestData()">点击按钮进行请求赋值 </button>

  <div>
    <ul>
        <li  v-for="(item,key) in list">
        {{key}}------  {{item}}
        </li>
    </ul>
  </div>
  </div>
</template>

<script>
export default {
  name: app,
  data () {
    return {
      msg: fsafasad,
       list:[]
    }
  },
  methods:{
    getMsg:function(){
      alert();
    
    },
   
     getMsg1(){

      alert();
    },
    requestData(){

      for(var i=0;i<10;i++){  
        this.list.push("这是第"+ i +"条数据");  //这地方就是点击按钮时,会重新赋值给model,model改变之后,view就会也跟着改变,这是双向绑定
      }
    }
}
}
</script>


<style>


</style>

 

vue的事件对象,方法执行

原文:https://www.cnblogs.com/fpcbk/p/10747372.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!