zoukankan      html  css  js  c++  java
  • v-on 绑定自定义事件

    每个 Vue 实例都实现了事件接口,即:

    • 使用 $on(eventName) 监听事件
    • 使用 $emit(eventName) 触发事件

    Vue 的事件系统与浏览器的 EventTarget API 有所不同。尽管它们的运行起来类似,但是 $on 和 $emit 并不是addEventListener 和 dispatchEvent 的别名。

    另外,父组件可以在使用子组件的地方直接用 v-on 来监听子组件触发的事件。

    下面通过个小例子来解释下该怎么进行父子组件间的监听:

    1、在子组件绑定 “clickEvent”  绑定事件:

    <template>
      <div>
          <a @click="clickEvent">
    
          </a>
      </div>
    </template>

    2、自组件 methods 里注册监听:

    methods: {
      clickEvent () {
         this.$emit('quit', ‘这个位子是可以加参数的’);
      }
    }

    3、在父组件里,绑定 quit 事件,进行监听:

    <template>
      <div>
            <a @quit="quit"></a>
      </div>
    <template>

    4、methods 里处理事件:

    methods: {
      quit (参数) {
         this.$router.push('first-login'); // 跳转到 first-login 页面
      } 
    }
  • 相关阅读:
    字符串型
    字符型
    实型(浮点型)
    sizeof
    数据类型
    标识符
    Win32汇编
    Win32汇编
    C# 语言程序设计笔记
    鬼泣4:寻找无限生命/剑气/暴怒
  • 原文地址:https://www.cnblogs.com/zhangym118/p/8631502.html
Copyright © 2011-2022 走看看