码迷,mamicode.com
首页 > 其他好文 > 详细

$on在构造器外部添加事件$once执行一次的事件$off关闭事件

时间:2017-06-06 01:14:33      阅读:236      评论:0      收藏:0      [点我收藏+]

标签:名称   method   span   使用   nbsp   匿名   blog   htm   vue   

$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.num--;
         })
         // 关闭事件
         function off(){
            vm.$off(‘reduce‘);
         }

// 外部调用内部事件
function reduce(){
    vm.$emit(‘reduce‘)
}
function reduceOnce(){
  vm.$emit(‘reduceOnce‘);
}

 

$on在构造器外部添加事件$once执行一次的事件$off关闭事件

标签:名称   method   span   使用   nbsp   匿名   blog   htm   vue   

原文地址:http://www.cnblogs.com/model-zachary/p/6947663.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!