javascript - vue.js使用watch监听数据变化的问题
天蓬老师
天蓬老师 2017-04-11 12:59:36
[JavaScript讨论组]

我在vue data里声明了一个specIndex的变量,然后我通过for改变specIndex的值,结果只能检测到for最后一次改变值得变化。
例如下面的写法,specIndex的值从1变成3,但是只能检测到最后一次specIndex等于3,请问大神我该如何处理,或者有其它方法实现类似的功能!

            for(var i=0;i<=3;i++){
                app.specIndex=i;
            }
        app.$watch('specIndex', function (newVal, oldVal) {
            var select2 = $("#Spec" + newVal).select2({ theme: "classic", placeholder: "请选择规格" });
            $(app.specListBox).each(function (i, item) {
                if (item.index == newVal) {
                    item.select2 = select2;
                    item.select2.on("change", function (e) {
                        var SepcValue = e.target.value;
                        item.SelectedparaValue = [];
                    });
                }
            });
        });
天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

全部回复(2)
怪我咯

因为watch多次触发,只有一次推入事件循环队列
异步更新队列

PHPz

https://cn.vuejs.org/v2/guide...

可能你还没有注意到,Vue 异步执行 DOM 更新。只要观察到数据变化,Vue 将开启一个队列,并缓冲在同一事件循环中发生的所有数据改变。如果同一个 watcher 被多次触发,只会一次推入到队列中。这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操作上非常重要。

我看文档有跟这个有关的说法。

直接一个for循环修改值太快了,试一下用setTimout延迟变化?比如


    for(var i=0;i<=3;i++){
        (function(j){
          setTimeout(function(){
             app.specIndex = j;
          },100*j)
        })(i)    
    }
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号