<!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的标签--> <!--<form action="">--> <!--<form action="" @submit="post('简单记录')">--> <!--<form action="" @submit="post_event('简单记录',$event)">--> <form action="" @submit.prevent="prevent_post('简单记录')"> <h1>{{date}}</h1> <button>提交</button>
</form>
</div>
<script>
var vue = function (options){new Vue(options)};
vue({
el:'#title',
data:{
title:'Vue 时间修饰符之使用$event和prevent修饰符操作表单'
}
});
var app = vue({
el:'#ask',
data:{
date:new Date()
},
methods:{
//会刷新页面
post(data){
alert(data)
},
//不会刷新页面
post_event(data,event){
event.preventDefault();//禁用浏览器默认事件
alert(data)
},
//不会刷新页面
prevent_post(data){
alert(data)
}
}
}); </script>
</body>
</html>

Vue 时间修饰符之使用$event和prevent修饰符操作表单的更多相关文章

  1. 026——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. Vue之@click、事件修饰符@click.stop与@click.prevent、按键修饰符@keyup.enter

    1.绑定监听@click: (以监听click为例,其他如keyup,用法类似)  v-on:click="fun"  @click="fun"  @click ...

  4. Vue学习之路第八篇:事件修饰符

    学习准备: ①.顾名思义,“事件修饰符”那么肯定是用来修饰事件,既然和事件有关系,那么肯定和“v-on”指令(也可简写为:@)有关系了. ②.事件修饰符有以下几类: .stop:阻止冒泡 .preve ...

  5. vue 时间选择器组件

    vue 时间选择器组件 组件效果: 单文件组件: <template> <div class="date-pickers"> <!--date为com ...

  6. VUE过滤器的使用 vue 时间格式化

    过滤器介绍 官方教程地址:https://cn.vuejs.org/v2/guide/filters.html 过滤器常被用于一些文本格式化 我们可以自定义过滤器,可以实现各种各样的功能. vue时间 ...

  7. vue 时间过滤器

    过滤器:定义:对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理).语法:1.注册过滤器: Vue.filter(name ,callback)或new Vue{filters:{}}2. ...

  8. 将html中的br换行符转换为文本输入中的换行符(转)

    PHP中的有个非常好的函数:nl2br(),将文本框中的换行转换为HTML页面的<br />,但是如何实现将html中的<br />换行符转换为文本框中的换行符呢?下面这几个方 ...

  9. java中普通的顶级类是不能使用static关键字修饰的。只有内部类可以使用static修饰,也可以不使用staitc关键字修饰。

    java中普通的顶级类是不能使用static关键字修饰的.只有内部类可以使用static修饰,也可以不使用staitc关键字修饰. java中的类可以是static吗?答案是可以.在java中我们可以 ...

随机推荐

  1. springboot传值踩坑

    由于我现在写的项目都是前后端分离的,前端用的是vue,后端springboot,于是前后端传值的问题就是一个比较重要的问题,为此我还特意去学了一下vue的传值,其实就是用一个axios组件,其实就是基 ...

  2. c#实现两个窗体相互传值

    本文转自:https://mp.csdn.net/postedit/100058721 1.功能展示 有时需要将子界面的内容传递到父界面,方法有好几种.经常用的是通过委托实现.具体的效果如下: ​   ...

  3. C语言入门-枚举

    常量符号化 用符号而不是具体的数字来表示程序中的数字 一. 枚举 用枚举而不是定义独立的const int变量 枚举是一种用户定义的数据类型,它用关键字enum如以下语句来声明 enum 枚举类型名字 ...

  4. MySQL数据库~~~~~创建用户和授权、备份和还原

    一 MySQL创建用户和授权 1.1 对新用户增删改 1.创建用户: # 指定ip:192.118.1.1的chao用户登录 create user 'chao'@'192.118.1.1' iden ...

  5. "(error during evaluation)" computed

    在vue-cli搭建的去哪网app项目中使用了  computed  计算属性 computed计算属性在chrome插件中的 vue devtools 插件中报错 应该显示出来 computed 属 ...

  6. [考试反思]1113csp-s模拟测试114:一梦

    自闭.不废话.写一下低错. T1:觉得信心赛T1不会很恶心一遍过样例直接没对拍(其实是想写完T2之后回来对拍的) 状态也不好,基本全机房都开始码了我还没想出来(skyh已经开T2了).想了40多分钟. ...

  7. jmeter 中使用正则表达式提取依赖参数

    1:登录接口 这里有一个实际的登录接口,在响应中返回了一串token,如下图 那么我们在接下来的接口-经验库列表中,就必须带入这一串token,否则响应报错,如下图所示    如何获取登录的口令呢?这 ...

  8. java并发编程-12个原子类

    背景 多线程更新变量的值,可能得不到预期的值,当然增加syncronized关键字可以解决线程并发的问题. 这里提供另外一种解决问题的方案,即位于 java.util.concurrent.atomi ...

  9. 解决CentOS7 Local time比实际时间相差8小时

    GPS系统中有两种时间区分,UTC就0时区的时间,CST为本地时间,如北京为早上八点(东八区),UTC时间比北京时晚八小时; CST:China Standard Time,UTC+8:00 中国沿海 ...

  10. SpringBoot中maven打包,启动报没有主清单属性

    有时候会出现这种情况,看一下项目的pom中是否有这个插件配置,没有的话需要引入. <build> <plugins> <plugin> <groupId> ...