$on  在构造器外部添加事件。
$on接收两个参数,第一个参数是调用时的事件名称,第二个参数是一个匿名方法。
如果按钮在作用域外部,可以利用$emit来执行。
html
 <div id="app">
<span>{{message}}</span>
<button @click="add()">+1</button>
</div>
<p><button onclick="reduce()">减少</button></p>
<p><button onclick="reduceOnce()">执行一次减少</button></p>
<p><button onclick="off()">关闭</button></p>
js
var vm = new Vue({
el:"#app",
data:{
message:1
},
methods:{
add:function(){
this.message++
}
}
})
// 实例事件
vm.$on('reduce',function(){
this.message--
})
//只使用一次的实例方法
vm.$once('reduceOnce',function(){
this.message--;
})
// 关闭事件
function off(){
vm.$off('reduce');
} // 外部调用内部事件
function reduce(){
vm.$emit('reduce')
}
function reduceOnce(){
vm.$emit('reduceOnce');
}

随机推荐

  1. Object-C-自定义类型归档

    对自定义类型的对象进行本地化保存,那么该类型必须实现NSCoding协议! NSCoding 协议中只有两个方法,都是require的方法,一个是把本身的类型进行编码,一个是解码成类对象,返回一个对象 ...

  2. Python 7 -- 文件存储数据

    上一节总结了一个基本web应用的代码,这一节主要讲用户访问的数据记录在log文件中,并显示在页面上. 这节步骤: 按以下目录建好相应的文件夹及内容 webapp|----vsearch4web.py ...

  3. 用django统计代码行数+注释行数

    实现统计代码行数: 1.首先在url.py中配置 from django.conf.urls import url from django.contrib import admin from app0 ...

  4. linux监控性能和网络的命令

    vmstat查看机器实时的综合情况:load,内存,swap,cpu使用率等方面 procs: r:运行队列中进程数量 b:等待IO的进程数量 memory(内存): swpd:使用虚拟内存大小 fr ...

  5. windows下多个python版本共存,如何在Windows7系统上安装最新的64位Python3.6.2

    windows下多个python版本共存,如何在Windows7系统上安装最新的64位Python3.6.2 1.官网下载python3.6.2https://www.python.org/ftp/p ...

  6. linux 文件压缩与解压缩

  7. Django框架----Ajax

    一.Ajax准备知识:json 说起json,我们大家都了解,就是python中的json模块,那么json模块具体是什么呢?那我们现在详细的来说明一下 1.json(Javascript  Obie ...

  8. nmap扫描验证多种漏洞

    nmap在Kali Linux中是默认安装的.它不仅可以用来确定目标网络上计算机的存活状态,而且可以扫描各个计算机的操作系统.开放端口.服务,还有可能获得用户的证书. 命令结构: nmap -sS - ...

  9. 数据库的增、删、改、查 (CURD)

    增改查删可以用CURD来表示  增加:create  修改:update   查找:read      删除:delete 增加create :  insert +表名+values+(信息): in ...

  10. JavaScript之BOM对象

    JavaScript bom对象 BOM对象 window对象 所有浏览器都支持 window 对象.概念上讲.一个html文档对应一个window对象.功能上讲: 控制浏览器窗口的.使用上讲: wi ...