<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件修饰符之使用$event与$prevent修饰符操作表单</title>
<script src="vue.js"></script>
</head>
<body>
<div id="hdcms">
<!--<form action="" @submit="post($event)">-->
<!--prevent 写入到代码里面等同于写入js中。阻止提交事件发生-->
<form action="" @submit.prevent="post('lantian')">
<h1>{{times}}</h1>
<button>提交</button>
</form>
</div>
<script>
var app = new Vue({
el: '#hdcms',
data: {
times: new Date()
},
methods: {
// post($event) {
// //preventDefault() 阻止元素发生默认的行为
// event.preventDefault();
// alert('lantian');
// },
post(num) {
alert(num);
}
}
});
</script> </body>
</html>

  

026——VUE中事件修饰符之使用$event与$prevent修饰符操作表单的更多相关文章

  1. Vue 时间修饰符之使用$event和prevent修饰符操作表单

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

  2. 26.VUE学习之--提交表单不刷新页面,事件修饰符之使用$event与prevent修复符操作表单

    提交表单不刷新页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. 027——VUE中事件修饰符:stop prevent self capture

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

  4. VUE中事件修饰符:stop prevent self capture

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

  5. 025——VUE中事件的基本使用与VUE中差异

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

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

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

  7. 028——VUE中事件修饰符once

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

  8. vue中事件代理

    由于在vue实例内部,this指向了实例本身,所以在编写事件代理的时候,用e.currentTarget引用绑定事件代理的元素,e.target引用事件目标元素.刚刚不注意想用this引用代理元素报错 ...

  9. vue中事件冒泡规则和事件捕获规则

    <div id="app"> <div @click="handleClickOne"> <p @click="hand ...

随机推荐

  1. 235. Lowest Common Ancestor of a Binary Search Tree(LCA最低公共祖先)

      Given a binary search tree (BST), find the lowest common ancestor (LCA) of two given nodes in the ...

  2. Spring-1-E Game(HDU 5011)解题报告及测试数据

    Game Time Limit:1000MS     Memory Limit:65536KB Description Here is a game for two players. The rule ...

  3. JMS--消息头

    一个消息对象分为三部分:消息头(Headers),属性(Properties)和消息体(Payload).对于StreamMessage和MapMessage,消息本身就有特定的结构,而对于TextM ...

  4. bind函数的作用

    面向连接的网络应用程序分为客户端和服务器端.服务器端的执行流程一般为4步,客户端程序相对简单,一般需要两个步骤. 服务器端执行流程4步如下: (1)调用socket函数,建立一个套接字,该套接字用于接 ...

  5. 【Python】模块

    廖雪峰教程笔记. [使用模块有什么好处?] 1.使用模块可以避免函数名和变量名冲突. 2.大大提高了代码的可维护性. [使用模块的注意点] 1.每一个.py文件就是一个模块. 2.每一个包目录下面必须 ...

  6. 20145216史婧瑶《Java程序设计》第一周学习总结

    20145216 <Java程序设计>第1周学习总结 教材学习内容总结 第一章 Java平台概论 1.1 Java不只是语言 1.Java三大平台:Java SE.Java EE与Java ...

  7. 20145314郑凯杰 《Java程序设计》第9周学习总结 积极主动敲代码

    20145314郑凯杰 <Java程序设计>第9周学习总结 教材学习内容总结 第十六章 ①JDBC(Java DataBase Connectivity) 即java数据库连接,是一种用于 ...

  8. 20145335郝昊《Java程序设计》第2周学习总结

    20145335郝昊<Java程序设计>第2周学习总结 教材学习内容总结 一.类型.变量与运算符 1.类型 整数: 可细分为为short整数(占2字节),int整数(占4字节),long整 ...

  9. TCP深入详解

    TCP三次握手.四次挥手时序图: #TCP协议状态机 1.TCP建立连接时的初始化序列号X.Y可以是写死固定的吗?      如果初始化序列号(缩写为ISN:Inital Sequence Numbe ...

  10. python爬虫之新浪微博登录

    fiddler 之前了解了一些常见到的反爬措施,JS加密算是比较困难,而微博的登录中正是用JS加密来反爬,今天来了解一下. 分析过程 首先我们去抓包,从登录到微博首页加载出来的过程.我们重点关注一下登 ...