stop属性:停止冒泡只执行到此处

self:只执行当前

代码：

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

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

    <title id="title">{{title}}</title>

</head>

<body>

<div id="ask"><!--vue不能控制body和html的标签-->

    <div @click.self="box" :style="{border: 'solid 2px red'}">

        <a href="http://ask.mykeji.net" @click.stop.prevent="links">简单记录</a>

    </div>

</div>

<script>

    var vue = function (options){new Vue(options)};

    vue({

        el:'#title',

        data:{

            title:'Vue STOP&SELF方法使用'

        }

    });

    var app = vue({

        el:'#ask',

        data:{

        },

        methods:{

            box(){

                alert('这是父级');

            },

            links(){

                alert("这是子级");

            }

        }

    });

</script>

</body>

</html>

Vue STOP&SELF方法使用的更多相关文章

  1. vue.js之生命周期，防止闪烁，计算属性的使用，vue实例简单方法和循环重复数据

    摘要:今天是比较糟糕的一天没怎么学习,原因是学校的wifi连不上了~~.今天学习一下vue的生命周期,如何防止闪烁(也就是用户看得到花括号),计算属性的使用,vue实例简单方法,以及当有重复数据时如何 ...

  2. vue数组变异方法

    Vue数组变异方法,会改变被这些方法调用的原始数组,将会触发视图更新 push() 接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度 pop() 从数组末尾移除最后一项,减少数组的 ...

  3. vue学习笔记（四）- cmd无法识别vue命令解决方法

    解决控制台无法识别vue命令问题 作者:狐狸家的鱼 本文链接:cmd无法识别vue命令解决方法 GitHub:sueRimn 在控制台输入vue会报以下错误: vue : 无法将“vue”项识别为 c ...

  4. vue教程2-04 vue实例简单方法

    vue教程2-04 vue实例简单方法 vue实例简单方法: vm.$el -> 就是元素 vm.$data -> 就是data <!DOCTYPE html> <htm ...

  5. Vue 生命周期方法

    一.Vue 生命周期 Vue的生命周期即是实例从创建到销毁的一个过程.之前在学习Vue的时候,看过官网的教程,但是经常用到的是mounted,所以对其他生命周期方法不是很熟悉,这里有空做个总结,也方便 ...

  6. 【转】安装Vue.js的方法

    安装vue.js的方法   一.简介 Vue.js 是什么 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量 ...

  7. 千锋教育Vue组件--vue基础的方法

    课程地址: https://ke.qq.com/course/251029#term_id=100295989 <!DOCTYPE html> <html> <head& ...

  8. Vue实例和方法

    github地址:https://github.com/manlili/vue_learn里面的lesson03 一 实例 每个 Vue 实例都会代理其 data 对象里所有的属性,改变data,vu ...

  9. vue 自定义全局方法

    import {myfun} from '../static/js/test.js' //se6的正确写法export default {methods:{ diyfun:function () { ...

随机推荐

  1. MYSQL之事务篇

    目录 事务概述 事务隔离级别 Read Uncommitted Read Committed Repeatable Read Serializable 事务概述 在引入事务之前我们先考虑银行转账的操作 ...

  2. 更新阿里yum源并重建缓存

    [第一种方式]1.下载安装wget /如果没有装的话yum install -y wget 2.备份默认的yummv /etc/yum.repos.d /etc/yum.repos.d.backup ...

  3. Oracle通过SQL语句查看table所引用的对象(View/Function/Procedure/Trigger)

    通过使用user_dependencies进行查看,如下: SELECT * FROM user_dependencies WHERE referenced_name='SFCUSN' --Table ...

  4. 数据治理的王者——Apache Atlas

    一.Atlas是什么? 在当今大数据的应用越来越广泛的情况下,数据治理一直是企业面临的巨大问题. 大部分公司只是单纯的对数据进行了处理,而数据的血缘,分类等等却很难实现,市场上也急需要一个专注于数据治 ...

  5. [PHP] swoole直接使用二进制包

    swoole提供一个编译好的二进制包,这个包连php都包含进去了,下载解压后就可以直接运行,都不用安装php 在这个地方直接下载二进制包 https://www.swoole.com/page/dow ...

  6. Python学习笔记六(免费获取代理IP)

    为获取网上免费代理IP,闲的无聊,整合了一下,免费从三个代理网站获取免费代理IP,目的是在某一代理网站被限制时,仍可从可以访问的其他网站上获取代理IP.亲测可用哦!^_^  仅供大家参考,以下脚本可添 ...

  7. 【西北师大-2108Java】第十四次作业成绩汇总

    [西北师大-2108Java]第十四次作业成绩汇总 作业题目 面向对象程序设计(JAVA) 第16周学习指导及要求 实验目的与要求 (1)掌握Java应用程序的打包操作: (2)掌握线程概念: (3) ...

  8. java之工厂方法设计模式

    工厂方法模式是设计模式中应用最广泛的模式.在面向对象的编程中,对象的创建工作非常简单,对象的创建时机却很重要.工厂方法模式就是解决这个问题,它通过面向对象的手法,将所要创建的具体对象创建工作延迟到了子 ...

  9. Java堆空间Vs栈内存

    之前我写了几篇有关Java垃圾收集的文章之后,我收到了很多电子邮件,请求解释Java堆空间,Java栈内存,Java中的内存分配以及它们之间的区别. 您可能在Java,Java EE书籍和教程中看到很 ...

  10. netty源码解析(4.0)-27 ByteBuf内存池:PoolArena-PoolThreadCache

    前面两章分析的PoolChunk和PoolSubpage,从功能上来说已经可以直接拿来用了.但直接使用这个两个类管理内存在高频分配/释放内存场景下会有性能问题,PoolChunk分配内存时算法复杂度最 ...