(精华2020年5月4日更新) vue教程篇事件冒泡和默认行为

最新推荐文章于 2023-06-21 10:16:25 发布

2b勿扰

最新推荐文章于 2023-06-21 10:16:25 发布

阅读量1.6w

点赞数 1

分类专栏： (持续更新)vue基础篇文章标签： vue.js

本文链接：https://blog.csdn.net/weixin_41181778/article/details/105912387

版权

(持续更新)vue基础篇专栏收录该内容

29 篇文章 3 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>事件冒泡和默认行为</title>
	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	<script>
		window.onload=function(){
			let vm=new Vue({
				el:'#app',
				methods:{ 
					show(){
						console.log(111);
						// e.stopPropagation();
					},
					print(){
						console.log(222);
					},
					write(){
						console.log(333);
					},
					study(){
						console.log(444);
						// e.preventDefault();
					}
				}
			});
		}
	</script>
</head>
<body>
	<div id="app">
		<div @click="write">
			<p @click="print">
				<!-- <button @click="show($event)">点我</button> -->
				<button @click.stop="show">点我</button>
			</p>
		</div>
		<hr>
		<!-- <a href="http://www.baidu.com" @click="study($event)">俺是链接</a> -->
		<a href="http://www.baidu.com" @click.prevent="study">俺是链接</a>
	</div>
</body>
</html>