当前位置: 首页 > news >正文

Vue09-事件处理

一、一个简单的示例

v-on:当xxx的时候。

二、事件处理

2-1、参数说明

    <div id="root"><h1>你好呀,{{name}}</h1><button v-on:click="showinfo">点击我</button></div><script>new Vue({el:'#root',data:{name:'milk',},methods:{showinfo(a, b, c, d){console.log(a,b,c,d);}}})</script>

a拿到的是:事件对象。是默认拿到的!

2-2、this 

事件中的this就是vue的实例对象。

当showInfo是箭头函数的时候,this是window

所以,所有被vue管理的函数,都写成普通函数!!!

2-3、v-on:click的简写=》@

2-4、传参

不传参:showInfo、传参:showInfo(参数)。

此时,event没有了!解决方式:使用$占位。

2-5、methods对比data

 

methods中的函数也在vm实例中,但是没有做数据代理,即没有getter和setter方法。

也可以把 methods中的函数放入到data中,但是此时,函数也做了数据代理,没有必要!

所以,只有data中的数据才做数据代理和数据劫持!

三、小结

相关文章:

  • 【鸿蒙开发】HarmonyOS开发 URL动态路由设计
  • Mac环境下,简单反编译APK
  • 探索未来制造,BFT Robotics引领潮流
  • Flink SQL实践
  • Python 机器学习 基础 之 【实战案例】中药数据分析项目实战
  • 自动化机械臂喷涂生产线方案五
  • 电子电气架构 —— 刷写模式:并行刷写
  • mysql中 redo日志(下)
  • 手撸 串口交互命令行 及 AT应用层协议解析框架
  • 北航第四次数据结构与程序设计编程题复习
  • 宝塔面板和 LNMP 环境下反代 HFish 蜜罐平台的正确方法
  • Spring Boot 复习
  • 正式发布 | 极海首款GHD3440电机专用栅极驱动器,构建多元电机产品矩阵
  • python使用阿里云邮箱发送email邮件
  • 【lesson4】服务端配置信息模块实现
  • 【JavaScript】通过闭包创建具有私有属性的实例对象
  • eclipse的离线汉化
  • JS变量作用域
  • js数组之filter
  • JS字符串转数字方法总结
  • Laravel5.4 Queues队列学习
  • MySQL QA
  • node-glob通配符
  • Redis提升并发能力 | 从0开始构建SpringCloud微服务(2)
  • Vue.js-Day01
  • 阿里云容器服务区块链解决方案全新升级 支持Hyperledger Fabric v1.1
  • 基于web的全景—— Pannellum小试
  • 看完九篇字体系列的文章,你还觉得我是在说字体?
  • 写代码的正确姿势
  • 原生Ajax
  • ​水经微图Web1.5.0版即将上线
  • ###51单片机学习(2)-----如何通过C语言运用延时函数设计LED流水灯
  • #mysql 8.0 踩坑日记
  • (003)SlickEdit Unity的补全
  • (6)添加vue-cookie
  • (a /b)*c的值
  • (C语言)求出1,2,5三个数不同个数组合为100的组合个数
  • (delphi11最新学习资料) Object Pascal 学习笔记---第5章第5节(delphi中的指针)
  • (搬运以学习)flask 上下文的实现
  • (大众金融)SQL server面试题(1)-总销售量最少的3个型号的车及其总销售量
  • (六)Hibernate的二级缓存
  • (四)【Jmeter】 JMeter的界面布局与组件概述
  • (学习日记)2024.02.29:UCOSIII第二节
  • (一)kafka实战——kafka源码编译启动
  • (转)【Hibernate总结系列】使用举例
  • ./configure,make,make install的作用(转)
  • .NET Core 和 .NET Framework 中的 MEF2
  • .net core 源码_ASP.NET Core之Identity源码学习
  • .NET DataGridView数据绑定说明
  • .NET 编写一个可以异步等待循环中任何一个部分的 Awaiter
  • .NET 依赖注入和配置系统
  • .NET大文件上传知识整理
  • .NET中两种OCR方式对比
  • .net中生成excel后调整宽度
  • /deep/和 >>>以及 ::v-deep 三者的区别