怎样使用 v-on 指令?
1. Vue 中的 v-on 指令用于绑定 dom 事件 的监听函数. 下面代码实现的是 点击更改文字颜色 的功能.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
<title>Vue Test</title>
</head>
<body>
<div id="app">
<p v-on:click="changeColor">Fly me to the Moon.</p>
</div>
<script>
var vApp = new Vue({
el: "#app",
methods: {
changeColor: function () { this.$el.style.color = "red" }
}
})
</script>
</body>
</html>
注意, this 指向这个 Vue 的实例对象.
2. v-on 可以简写为 @ , 比如 v-on:click 可以写为 @click
怎样使用 v-on 指令?的更多相关文章
- v:bind指令对于传boolean值的注意之处
1,
- linux查看文件相关指令
以下内容整理自以下两篇文章: http://www.cnblogs.com/xilifeng/archive/2012/10/13/2722596.html Linux 查看文件内容的命令 http: ...
- linux文件管理指令
总述 所有指令都可以使用--help来查看说明 例如:cat --help -x 表示参数 1.cat:用于打印文件(cat -x filename) 参数: -n:由1开始对每行进行编号 -b:由1 ...
- git 指令笔记
狂躁,太狂躁!!赶上过年,赶上自己的懒癌,12月底就学完的教程直到今天才整理笔记,中途沉默在游戏中..... 只给出Windows下git指令操作,推荐大家去廖雪峰前辈那里学习(百度搜索:廖雪峰的官方 ...
- Linux里面的压缩和解压类指令
gzip/gunzip 指令 ( .gz 不能压缩目录) gzip 用于压缩文件, gunzip 用于解压的 . gzip gzip命令用来压缩文件.gzip是个使用广泛的压缩程序,文件经它压缩过后 ...
- Linux服务器安全配置
众所周知,网络安全是一个非常重要的课题,而服务器是网络安全中最关键的环节.Linux被认为是一个比较安全的Internet服务器,作为一种开放源代码操作系统,一旦Linux系统中发现有安全漏洞,Int ...
- orpsocv2 从ROM(bootrom)启动分析--以atlys板子的启动为例子
1 复位后的启动地址 1) 复位后,启动地址在or1200_defines.v最后宏定义,atlys板子的目录:orpsocv2\boards\xilinx\atlys\rtl\verilog\inc ...
- Linux下的压缩和解压缩命令——zip/unzip
zip命令 zip是个使用广泛的压缩程序,文件经它压缩后会另外产生具有".zip"扩展名 的压缩文件. 选项: -A 调整可执行的自动解压缩文件. -b<工作目录> ...
- linux commands
abrt-cli --since ;查看abrt捕捉的异常 alias ;别名,alias rm='rm -i':使用“ \rm ” 使用原命令 alsamixer ;图形音量调节,q 增加左声道, ...
- Linux权限管理.md
Linux 文件的权限 Linux文件权限简介 Linux 文件或目录的属性主要包括:文件或目录的节点.种类.权限模式.链接数量.所归属的用户和用户组.最近访问或修改的时间等内容.具体情况如下: # ...
随机推荐
- vga转HDMI与hdmi转VGA区别
- matlab遍历文件夹下所有图片和遍历所有子文件夹下图片
做图像处理实验,经常需要遍历当前文件下所有图片.matlab当然很早就考虑了这个问题,库函数dir就是完成这个工作的.函数返回的是一个存放所有目录下文件信息的结构体,通过遍历结构体就可以达到访问所有文 ...
- 在业务控制方法中写入模型变量收集参数,且使用@InitBind来解决字符串转日期类型
1) 在默认情况下,springmvc不能将String类型转成java.util.Date类型,所有我们只能在Action 中自定义类型转换器 <form action="${pa ...
- Scrapy框架——使用CrawlSpider爬取数据
引言 本篇介绍Crawlspider,相比于Spider,Crawlspider更适用于批量爬取网页 Crawlspider Crawlspider适用于对网站爬取批量网页,相对比Spider类,Cr ...
- Nginx教程[归档]
前言 其一,Nginx不是随随便便一篇博文就能讲清楚的,严谨地说,笔者连入门者都算不上:其二,此文系前段日子里,学习Nginx时的笔记归档类博文,还有诸多不完整处,仅供参考. 写这篇博文的时间点:20 ...
- 35 个最好用 Vue 开源库
2018年度 35 个最好用 Vue 开源库 在本文中,我们将推荐一些非常好用的 Vue 相关的开源项目.无论是开发新手还是经验丰富的老手,我们都喜欢开源软件包.对于开发者来说,如果没有这些开源软件包 ...
- vue-cli的项目中关于axios的全局配置,结合element UI,配置全局loading,header中做token传输
在src目录中建立plugins文件夹,在文件夹内建立axios.js文件 "use strict"; import Vue from 'vue'; import axios fr ...
- Attention is all you need 详细解读
自从Attention机制在提出之后,加入Attention的Seq2Seq模型在各个任务上都有了提升,所以现在的seq2seq模型指的都是结合rnn和attention的模型.传统的基于RNN的Se ...
- 解决 ThinkPHP 5 把控制器下的文件夹当做控制器输出的问题
目录结构: application/home/controller/user_info/User.php 输入路由:/home/user_info/user/index 看样子没毛病,但会报错: 这是 ...
- Vuecli 3.0 项目自定义添加静态目录,支持在index.html引入
参考链接:https://blog.csdn.net/qq_15253407/article/details/89491255