Vue STOP&SELF方法使用
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方法使用的更多相关文章
- vue.js之生命周期，防止闪烁，计算属性的使用，vue实例简单方法和循环重复数据
摘要:今天是比较糟糕的一天没怎么学习,原因是学校的wifi连不上了~~.今天学习一下vue的生命周期,如何防止闪烁(也就是用户看得到花括号),计算属性的使用,vue实例简单方法,以及当有重复数据时如何 ...
- vue数组变异方法
Vue数组变异方法,会改变被这些方法调用的原始数组,将会触发视图更新 push() 接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度 pop() 从数组末尾移除最后一项,减少数组的 ...
- vue学习笔记（四）- cmd无法识别vue命令解决方法
解决控制台无法识别vue命令问题 作者:狐狸家的鱼 本文链接:cmd无法识别vue命令解决方法 GitHub:sueRimn 在控制台输入vue会报以下错误: vue : 无法将“vue”项识别为 c ...
- vue教程2-04 vue实例简单方法
vue教程2-04 vue实例简单方法 vue实例简单方法: vm.$el -> 就是元素 vm.$data -> 就是data <!DOCTYPE html> <htm ...
- Vue 生命周期方法
一.Vue 生命周期 Vue的生命周期即是实例从创建到销毁的一个过程.之前在学习Vue的时候,看过官网的教程,但是经常用到的是mounted,所以对其他生命周期方法不是很熟悉,这里有空做个总结,也方便 ...
- 【转】安装Vue.js的方法
安装vue.js的方法 一.简介 Vue.js 是什么 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量 ...
- 千锋教育Vue组件--vue基础的方法
课程地址: https://ke.qq.com/course/251029#term_id=100295989 <!DOCTYPE html> <html> <head& ...
- Vue实例和方法
github地址:https://github.com/manlili/vue_learn里面的lesson03 一 实例 每个 Vue 实例都会代理其 data 对象里所有的属性,改变data,vu ...
- vue 自定义全局方法
import {myfun} from '../static/js/test.js' //se6的正确写法export default {methods:{ diyfun:function () { ...
随机推荐
- Docker Compose安装Registry后配置WebUI与客户端
场景 Docker 私服Registry简介与使用Docker-Compose安装Registry: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article ...
- 龙芯（mips64）电脑安装NodeJS
背景 龙芯是国产的cpu,采用是mips架构,就类似大家熟知的x86.arm. 最近在一台龙芯电脑(系统是中兴新支点,Linux)上调试前端应用(electron),于是就需要安装NodeJS. 但是 ...
- Electron npm install 常见错误（Windows）
问题一:node_gyp使用版本不对 if not defined npm_config_node_gyp (node "C:\Users\Administrator\AppData\Roa ...
- echarts 双Y轴图表
直接代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- 47.QT-QChart之曲线图,饼状图,条形图使用
1.使用准备 在pro中, 添加QT+= charts 然后在界面头文件中添加头文件并声明命名空间,添加: #include <QtCharts> QT_CHARTS_USE_NAMES ...
- mybatis报错: java.lang.IllegalArgumentException invalid comparison: java.util.Date and java.lang.String
原因是在使用<if> 进行条件判断时, 将datetime类型的字段与 ' ' 进行了判断,导致的错误 解决, 只使用 <if test="createTime != n ...
- ASCII码表收藏
ASCII码表 ASCII码值 ESC键 VK_ESCAPE (27)回车键: VK_RETURN (13)TAB键: VK_TAB (9)Caps Lock键: VK_CAPITAL (20)Shi ...
- tcp客户端程序开发
https://www.cnblogs.com/python-No/ 话不多说,直接进入正题 一:客户端一共分为5大块: 1.创建客户端套接字 2.和服务端套接字建立连接 3.发送数据 4.接收发送 ...
- JS原型链与instanceof底层原理
一.问题: instanceof 可以判断一个引用是否属于某构造函数: 另外,还可以在继承关系中用来判断一个实例是否属于它的父类型. 老师说:instanceof的判断逻辑是: 从当前引用的proto ...
- Python 教你识别淘宝刷单，买到称心如意的商品
发际线堪忧的小 Q,为了守住头发最后的尊严,深入分析了几十款防脱洗发水的评价,最后综合选了一款他认为最完美的防脱洗发水. 一星期后,他没察觉到任何变化. 一个月后,他用卷尺量了量,发际线竟然后退了 0 ...