$on  在构造器外部添加事件。
$on接收两个参数,第一个参数是调用时的事件名称,第二个参数是一个匿名方法。
如果按钮在作用域外部,可以利用$emit来执行。 html
 <div id="app">
<span>{{message}}</span>
<button @click="add()">+</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:
},
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. recv() failed (104: Connection reset by peer) while reading response header from upstream

    2017年12月1日10:18:34 情景描述: 浏览器执行了一会儿, 报500错误 运行环境:  nginx + php-fpm nginx日志:  recv() failed (104: Conn ...

  2. 根据CAS协议写的简单的SSO框架

      前言: 考虑到现在分布式应用都不可或缺的一个重要部分:单点登录,决定花点时间去学下.本来想直接上现成的CAS框架的,初步的了解了一下后,觉得这个太庞大了,而且不好定制,要完全深度用起来也没那么简单 ...

  3. 后台调用前台js方法

    后台调用前台jsClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<s ...

  4. JSP中request获取值

    获取项目名:request.getContextPath(); 获取IP:request.getServerName() 获取端口:request.getServerPort() pageContex ...

  5. vuex——做简单的购物车功能

    购物车组件 <template> <div> <h1>vuex-shopCart</h1> <div class="shop-listb ...

  6. vue -webpack.dev.config.js模拟后台数据接口

    在const portfinder = require('portfinder')后面添加 const express = require('express') const app = express ...

  7. MSChart的研究(转)

    介绍MSChart的常用属性和事件 MSChart的元素组成 最常用的属性包括 ChartAreas:增加多个绘图区域,每个绘图区域包含独立的图表组.数据源,用于多个图表类型在一个绘图区不兼容时. A ...

  8. js学习——基础知识

    数据类型 函数.方法 变量作用域 运算符 条件语句 break和continue typeof 错误(异常) 变量提升 严格模式 JSON void(0) JavaScript            ...

  9. 在 Confluence 6 中禁用 workbox 应用通知

    如果你选择 不提供应用通知(does not provide in-app notifications): Confluence workbox 图标将不会可见同时用户也不能在这个服务器上访问 wor ...

  10. Confluence 6 在初始化配置时候的问题

    提交一个 服务器请求(support request) 然后在你的服务请求中同时提供下面的信息. 下载一个 LDAP 浏览器,你可以通过这个确定你的 LDAP 服务器配置正确.Atlassian 推荐 ...