方法都写在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=;i<;i++){
this.list.push("这是第"+ i +"条数据"); //这地方就是点击按钮时,会重新赋值给model,model改变之后,view就会也跟着改变,这是双向绑定
}
}
}
}
</script> <style> </style>

vue的事件对象,方法执行的更多相关文章

  1. Vue事件 定义方法执行方法 获取数据 改变数据 执行方法传值 以及事件对象

    <template> <div id="app"> <!-- <img v-bind:src='url' /> <img :src= ...

  2. vue2.* 事件 定义方法 执行方法 获取数据 改变数据 执行方法传值 以及事件对象 05

    <template> <div id="app"> <button v-on:click="run1()">执行事件的第一种 ...

  3. Vue入门---事件与方法详解

    一. vue方法实现 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

  4. vue的事件对象

    事件对象: v-on:click/mouseover 简写:     @click=""   @click="show($event)" <input t ...

  5. Vue 获取数据、事件对象、todolist

    vue中在方法里获取data里的msg:this.msg 在微信小程序里this.data.msg 改变data里的msg:this.msg="改变后的msg" 可以通过list. ...

  6. vue的事件

    vue的事件: vue事件简写: vue中事件是 v-on:click=' show()'    但是我嫌弃它写太长每次都要 v-on: 事件 vue中就有事件简写   @click='show()' ...

  7. HTML DOM 事件对象

    HTML DOM 事件对象 由 youj 创建,小路依依 最后一次修改 2016-08-04 HTML DOM 事件 HTML DOM 事件 HTML DOM 事件允许Javascript在HTML文 ...

  8. JS HTML DOM 事件对象(onclick、onmouseenter)

    HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序. 事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户点击按钮). HTML DOM 事件 DOM:  ...

  9. HTML DOM 事件与方法

    HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序. 事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户点击按钮). 鼠标事件 键盘事件 框架/对象(F ...

随机推荐

  1. lombok自带的slfj使用方法

    1.pom.xml <dependency> <groupId>org.projectlombok</groupId> <artifactId>lomb ...

  2. CPU与GPU性能的比较报告

    运行时间分析 不同的模型在cpu和gpu下的时间差异较大,一般来说gpu会比cpu快5-20倍.我们选用了最常用的inception v3的分类模型,输入图片尺寸为:3x299x299. GPU 在一 ...

  3. WPF Button 样式

    WPF CheckBox 自定义样式 给Button设置ToolTip <Style TargetType="{x:Type Button}" x:Key="Def ...

  4. poi操作Excel的封装类

    这是一个简单的对poi的封装,只能简单的取值,设值,拷贝行,插入行等. 针对读取Excel模板后,填值再保存的应用,比较方便. poi版本:3.13 贴代码: package cn.com.gtmc. ...

  5. PCL点云配准(3)

    (1)关于点云的配准 1.首先给定源点云与目标点云. 2.提取特征确定对应点 3.估计匹配点对应的变换矩阵 4.应用变换矩阵到源点云到目标点云的变换 配准的流程图 通过特征点的匹配步骤 (1)计算源点 ...

  6. HTML 01 请求过程

    与 HTTP 关系密切的协议, IP, TCP, DNS IP协议的作用是把各种数据包传送给对方, 而要保证确实传送到对方那里, 需要满足各种条件. 其中两个最重要的条件是 IP地址 和 MAC 地址 ...

  7. A股主要指数的市盈率(PE)估值高度

    全指材料(SH000987) - 2019-03-18日,当前值:14.6662,平均值:29.73,中位数:25.66,当前 高于 6.91% 的交易日.全指材料(SH000987)的历史市盈率PE ...

  8. [原]unity5 AssetBundle 加载

    本文unity版本5.1.3 一.现有的打包教程: 1.http://liweizhaolili.blog.163.com/blog/static/16230744201541410275298/ 阿 ...

  9. 新唐N32905U1DN开发教程:MDK环境下工程搭建(官方提供的固件库)(转)

    前言:新唐N32905U1DN单片机不支持用户将程序烧录到内部FLASH,必须外挂FLASH存储用户程序,可以是SPI FLASH.NAND FLASH.SD卡.用户采用裸机开发的方式可使用官方提供的 ...

  10. Windows上使用telnet测试端口号

    之前测试服务器某一端口开启开启情况一般在服务器上使用  netstat –ano|findstr "端口号"命令查看. 但是有时候端口在服务器上开通了,但是客户端并不一定可以访问到 ...