vue的功能非常强大,但是我们作为一个后端开发人员,前端的东西不一定都弄的很明白,今天就给大家介绍一个回车提交表单的真实案例,达到回车登录的效果!

@ keyup.enter 实现的效果

<input v-model = "password" type="password" name="" class="pwd" placeholder="密码" @keyup.enter="handellogin">// 这里是一个输入框 

 methods:{
handellogin(){
this.$axios.post(`${this.$settings.Host}/users/login/`,{
username:this.username,
password:this.password
}).then(response=>{
console.log(response.data);
this.$message({
message: '恭喜你,登录成功了',
type: 'success'
});
this.$router.push({ path:'/' })
}).catch(error=>{
if (error.response.status === 400) {
this.$message.error('密码错误哦,您在好好想想哦');
} })
}, },

vue.js中 ,回车键实现登录或者提交表单!的更多相关文章

  1. Atitit vue.js 把ajax数据 绑定到form表单

    Atitit vue.js 把ajax数据 绑定到form表单 1.1. 使用场景:主要应用在编辑与提交场合..1 1.2. 绑定数据到form控件,可以使用jquery,不过vue.js更加简单1 ...

  2. 在javascript中关于submit和button提交表单区别

    submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和button,二者都以按钮的形式展现,看起来都是按钮,所不同的是type属性和处发响应的事件上. ...

  3. (转)在javascript中关于submit和button提交表单区别

      原文来自:http://www.jb51.net/article/42236.htm   submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和b ...

  4. JS采用ActiveXObject实现用户在提交表单时屏蔽敏感词的功能

    本例中敏感词ciku.txt放在C盘根目录下,采用的ActiveXObject插件获取本地文件内容.使用此插件不需网上下插件,直接用如下js代码即可. 浏览器需修改interner安全选项的级别,启用 ...

  5. Angular JS 中的内置方法之表单验证

    angular js 结合html5 可以实现强大的表单验证功能 关闭html5自带的表单验证功能可以用

  6. Node.js学习笔记(2)--提交表单

    说明(2017-5-2 11:42:33): 1. index.html <!DOCTYPE html> <html lang="en"> <head ...

  7. Struts2 token禁止重复提交表单

    如果服务器响应慢的情况下,用户会重复提交多个表单,这时候有两种设计思想: 1.在客户端使用JS技术,禁止客户重复提交表单.但是这样会使一些不使用浏览器方式登陆的人比如使用底层通信来攻击你的服务器 2. ...

  8. form表单action提交表单,页面不跳转且表单数据含文件的处理方法

    在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...

  9. Asp.net Mvc Ajax.BeginForm提交表单

    之前Mvc中一直用Html.BeginForm提交表单,即如下: @using (Html.BeginForm("Add", "News", FormMetho ...

随机推荐

  1. Tkinter 之主窗口参数

    一.常用参数 语法 作用 window= tk.TK() 创建窗口 window['height'] = 300 设置高 window['width'] = 500 设置宽 window.title( ...

  2. 使用python3安装frida-tools出错

    执行安装命令 pip3.6 install frida-tools 得到错误信息 error: <urlopen error [SSL: CERTIFICATE_VERIFY_FAILED] c ...

  3. 2018-2019-2 网络对抗技术 20165231 Exp9 Web安全基础

    实验内容 本实践的目标理解常用网络攻击技术的基本原理,做不少于7个题目,共3.5分.包括(SQL,XSS,CSRF).Webgoat实践下相关实验. 实验过程 WebGoat: Webgoat是OWA ...

  4. JavaScript中获取html元素常用手法和区分

    对于许多前端开发项目来说,获取元素进行操作是必不可少的,例如tab标签,全屏切换,自动滚播等效果都需要通过获取节点元素来实现.下面我来总结下JavaScript最常用的4个Document对象中获取元 ...

  5. django + vue3 解决跨越问题

    django跨域 解决: https://yq.aliyun.com/articles/517215 vue3 跨越(此处没必要,django处理即可): https://blog.csdn.net/ ...

  6. 移动端安卓和 IOS 开发框架 Framework7 布局

    对应的各种效果,Framework7 里面实现的方式比较多,这里我就只写我用的一种,样式有的自己修改了的,想看官方详细的参见 http://framework7.cn 一.手风琴布局Accordion ...

  7. lua字符串处理(string库用法)

    原文地址http://www.freecls.com/a/2712/f lua的string库是用来处理字符串的,基础函数如下 string.byte(s [, i [, j]]) string.by ...

  8. osgGA::KeySwitchMatrixManipulator 跟随

    #ifdef _WIN32 #include <Windows.h> #endif // _WIN32 #include <osg/Group> #include <os ...

  9. 阶段5 3.微服务项目【学成在线】_day17 用户认证 Zuul_18-身份校验-测试

    在顶级域名下配置 网关的地址在上面配置一下 重启nginx 拒绝访问后面的代码都加上 return null 开始测试 换成域名的方式访问 有cookie.但是拿不到header 加上header测试 ...

  10. Node.jsp配环境更新中)

    设置用户密码sudo passwd user1sudo passwd root 创建新用户sudo useradd -d /home/share -m sharesu share设置新用户密码sudo ...