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');
    }
  • 相关阅读:
    windows通过Composer安装yii2
    jquery自定义函数
    js 回调
    读取.properties配置文件
    spring @ModelAttribute 注解
    excel导出
    spring定时器
    maven添加自己的jar包到本地仓库
    activeMq 消费者整合spring
    linux操作命令
  • 原文地址:https://www.cnblogs.com/Model-Zachary/p/6947663.html
Copyright © 2011-2022 走看看