Vue使用监听器模拟用户名重复验证

柔情只为你懂 2023-02-12 05:54 33阅读 0赞

Vue.js 监听属性 watch，我们可以通过 watch 来响应数据的变化。

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <div id="app">
      用户名 ： <input id="firstname" type="text" v-model.lazy="uname" >{
       {tip}} 
    
    </div>
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript">
        var vm = new Vue({
            el: '#app',
            data: {
             uname:'',
                tip:''
            },
            methods:{
              checkName:function (name) {
                  var that = this
        setTimeout(function () {//设置演示，模拟后台传送数据
    
            if(name=='admin'){
               that.tip='用户名存在'
              }else{
                that.tip='用户名可以使用 '
         }
        
        } ,200)
    
              }
            },
            watch:{
                uname:function (val) {
                    this.checkName(val);
                    this.tip="正在验证。。"
                }
    
            }
    
    
        })
    </script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，33人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue2【监听器】

目录 1：监听器的作用 2：语法格式 3：示例 4：应用场景 4.1：axios发送请求 4.2：JQuery发送请求 5：监听器的格式： 5.1：函数格式的监

清疚/ 2023年10月13日 12:37/ 0 赞/ 65 阅读

相关使用正则表达式验证用户名和密码

当我第一次学习 Web 开发时，我一直无法理解的工具之一就是正则表达式。自从我找到第一份工程工作以来已经过去了大约一年半的时间，这种理解程度一直持续到最近。我以前并不真正需

分手后的思念是犯贱/ 2023年10月12日 20:42/ 0 赞/ 113 阅读

相关使用用户名和密码身份验证保护 MQTT

身份验证是识别用户并验证他们是否有权访问系统或服务器的过程。它是一种安全措施，可以保护系统免受未经授权的访问，并保证只有有效用户才能使用该系统。鉴于物联网行业的广泛性，验证

我就是我/ 2023年09月26日 21:47/ 0 赞/ 213 阅读

相关 Vue使用监听器模拟用户名重复验证

Vue.js 监听属性 watch，我们可以通过 watch 来响应数据的变化。 <!DOCTYPE html> <html lang="en">

柔情只为你懂/ 2023年02月12日 05:54/ 0 赞/ 34 阅读

相关验证码机制之验证码重复使用

文章目录介绍漏洞原理测试案例防御方案摘抄介绍

冷不防/ 2022年11月21日 15:19/ 0 赞/ 466 阅读

相关 vue.js 模拟input滑块验证效果

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JyaWdo

野性酷女/ 2022年10月15日 00:39/ 0 赞/ 290 阅读

相关 ajax使用之验证用户名是否存在

ajax使用非常广，比如验证用户名、二级联动等。实现的效果如下： ![SouthEast][]![SouthEast 1][] 前台代码如下： <%@ pa

迈不过友情╰/ 2022年09月21日 04:00/ 0 赞/ 245 阅读

相关 jquery验证用户名

function chkUsername(username) \{ if(username=="") \{ return 0; \} else if(

今天药忘吃喽~/ 2022年08月07日 10:43/ 0 赞/ 258 阅读

相关用户名重复

检验用户名是否重复 def checkuser(request): uname = request.GET.get('uname')

逃离我推掉我的手/ 2022年06月03日 06:39/ 0 赞/ 186 阅读

相关 JQuery Ajax后台无刷新验证用户名重复，前台验证两次密码一致，后台创建并验证验证码

写在前面写web 的人，我想最先要解决的就是注册登录的界面了，一个小小的界面却包含着各种基本的知识，让我这个新手摸了一天。效果图 ![这里写图片描述][70]

曾经终败给现在/ 2022年05月15日 22:09/ 0 赞/ 273 阅读