2. Vue prevent修饰符
原创
©著作权归作者所有:来自51CTO博客作者可乐不可的原创作品,请联系作者获取转载授权,否则将追究法律责任
Vue prevent修饰符
-
概述
prevent修饰符用于阻止默认事件的触发
-
用法
<!doctype html><html lang="en"><head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Vue prevent修饰符</title></head><body><div id="app">
<form action="www.baidu.com" method="get" @submit.prevent>
<input type="text" value="用户名"><br>
<input type="text" value="密码"><br>
<input type="submit" value="提交" @click="submitBtn"><br>
</form>
<br>
<input type="button" value="按钮" @click.prevent="btnClick"></div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script>
let app = new Vue({
methods:{
submitBtn(){
console.log('阻止了默认事件!')
},
btnClick(){
console.log('按钮默认事件')
}
},
}).$mount("#app")</script></body></html>