zoukankan      html  css  js  c++  java
  • $on在构造器外部添加事件(通过$emit进行外部调用)$once执行一次的事件(通过$emit进行外部调用)$off关闭事件

    $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');
    }
  • 相关阅读:
    lighting
    移动端
    SVN常见问题
    前四章知识点小结
    如何不运用第三方变量实现两个数的交换
    awk
    sort
    cut
    sed
    30道Linux面试题
  • 原文地址:https://www.cnblogs.com/Model-Zachary/p/6947663.html
Copyright © 2011-2022 走看看