<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>让元素事件只执行一次事件，就可以使用once </title>

    <script src="vue.js"></script>

</head>

<body>

<div id="hdcms">

    <div>

        <a href="https://www.baidu.com/" @click.stop.prevent.once="links">百度</a>

    </div>

</div>

<script>

    var app = new Vue({

        el: '#hdcms',

        data: {

            times: new Date()

        },

        methods: {

            links() {

                alert("百度一下");

            }

        }

    });

</script>

</body>

</html>

　　

028——VUE中事件修饰符once的更多相关文章

  1. 026——VUE中事件修饰符之使用$event与$prevent修饰符操作表单

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 027——VUE中事件修饰符：stop prevent self capture

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. VUE中事件修饰符：stop prevent self capture

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  4. vue中事件修饰符详解(stop, prevent, self, once, capture, passive)

    ==.stop== 是阻止冒泡行为,不让当前元素的事件继续往外触发,如阻止点击div内部事件,触发div事件 ==.prevent== 是阻止事件本身行为,如阻止超链接的点击跳转,form表单的点击提 ...

  5. vue中的修饰符

    Vue2.0学习笔记:Vue事件修饰符的使用   事件处理 如果需要在内联语句处理器中访问原生DOM事件.可以使用特殊变量$event,把它传入到methods中的方法中. 在Vue中,事件修饰符处理 ...

  6. Vue的事件修饰符

    转载于:https://www.cnblogs.com/xuqp/p/9406971.html 事件处理 如果需要在内联语句处理器中访问原生DOM事件.可以使用特殊变量$event,把它传入到meth ...

  7. vue中.sync修饰符，实现子组件实时更新父组件的值

    vue 修饰符sync的功能是:当一个子组件改变了一个 prop 的值时,这个变化也会同步到父组件中所绑定. 不过它有一个前身,先来看看.sync出现之前是如何实现的 父组件中(传递给子组件一个值:p ...

  8. vue中.sync 修饰符

    一直以来,都不太明白.sync的用法,归根结底原因在于,没有仔细阅读“.sync修饰符”. 正好,最近在拿一个项目练手,然后使用了elment-ui,然后在用到dialog的时候,属性visible是 ...

  9. Vue中.sync修饰符

    Vue 中 sync的作用 <FatherComponent :a.sync = 'b'><FatherComponent /> 子组件中emit('update:a',... ...

随机推荐

  1. PKU 3020 Antenna Placement(拆点+最小边覆盖)(最大匹配)

    题目大意:原题链接 一个矩形中,有N个城市’*’,现在这n个城市都要覆盖无线,若放置一个基站,那么它至多可以覆盖相邻的两个城市.问至少放置多少个基站才能使得所有的城市都覆盖无线? 提示:看清楚题目,' ...

  2. JavaScript之从头再来

    引入文件 1. 引入外部文件 <script type="text/javascript" src="JS文件"></script> 2 ...

  3. json转List、Map

    import java.util.ArrayList; import java.util.HashMap; import java.util.Iterator; import java.util.Li ...

  4. ajax的认识

    1. ajax是一种技术,无需刷新页面即可向服务器传输.读写数据. 2. ajax的参数说明: 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为 ...

  5. java线程方面的知识

    java中单继承,多实现的: 若为多继承,那么当多个父类中有重复的属性或者方法时,子类的调用结果会含糊不清,因此用了单继承. 为什么是多实现呢? 通过实现接口拓展了类的功能,若实现的多个接口中有重复的 ...

  6. java反射 - getXXX 与 getDeclaredXXX

    1.getXXX 和 getDeclaredXXX java 里 Class<?> 有下面这些方法: 类似的方法有: 2.getMethod(s) 和 getDeclaredMethod( ...

  7. 高手用的SourceInsight配置文件——仿Sublime风格【转】

    本文转载自:https://blog.csdn.net/weixin_38233274/article/details/80209100 配置文件下载地址:https://download.csdn. ...

  8. Redis-与python交互

    安装包 到中文官网查找客户端代码 联网安装 sudo pip install redis 使用源码安装 unzip redis-py-master.zip cd redis-py-master sud ...

  9. MySQL: Speed of INSERT Statements

    Speed of INSERT Statements To optimize insert speed, combine many small operations into a single lar ...

  10. Tachyon：Spark生态系统中的分布式内存文件系统

    转自: http://www.csdn.net/article/2015-06-25/2825056  摘要:Tachyon把内存存储的功能从Spark中分离出来, 使Spark可以更专注计算的本身, ...