Vue 中的 watch使用

最新推荐文章于 2023-11-20 20:39:49 发布

小盆友你是否很有多问号

最新推荐文章于 2023-11-20 20:39:49 发布

阅读量78

点赞数

分类专栏：前端文章标签： vue vue.js

本文链接：https://blog.csdn.net/qq_43369949/article/details/118633182

版权

前端专栏收录该内容

12 篇文章 0 订阅

订阅专栏

Vue 中的 watch使用

watch：侦听属性
当你有一些数据需要随着其它数据变动而变动时可以使用
列举场景：当你注册的时候呢，校验用户名是否合法，不合法随机给出提示，包括很多的异步操作，都会写在watch中
案列

<body>
    <div id="app">
        <input v-model.lazy="username">{{msg}}

    </div>

</body>
<script>
    var vm = new Vue({

        el: "#app",
        data: {
            username : "",
            msg:""
        },

        methods: {

        },
        watch: {
            username: function (val) {             
                if(val=="123456"){
                    this.msg ="用户名合法";
                }else{
                    this.msg ="用户名已经存在";
                }
                
            }
        }




    })
</script>

结果
在这里插入图片描述
对于对象的监听，加上deep：true

小盆友你是否很有多问号

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Vue 中的 watch使用

Vue 中的 watch使用watch：侦听属性当你有一些数据需要随着其它数据变动而变动时可以使用列举场景：当你注册的时候呢，校验用户名是否合法，不合法随机给出提示，包括很多的异步操作，都会写在watch中案列<body> <div id="app"> <input v-model.lazy="username">{{msg}} </div></body><script> var
复制链接

扫一扫