gpt4 book ai didi

javascript - watch 是异步的吗?

转载 作者:搜寻专家 更新时间:2023-10-30 22:35:17 24 4
gpt4 key购买 nike

我在 Vue 实例中观察变量 radioStatus:

watch: {
radioStatus: function(val) {
if (!this.discovery) {
$.ajax({ url: '/switch/api/radio/' + (val ? 'on' : 'off') })
}
}

它可以在页面重新加载时触发的 AJAX 调用中修改:

$.ajax({
url: "/api",
cache: false
})
.done(function(response) {
vm.discovery = true;
vm.radioStatus = response.radio.ison; // <-- the change I mention below is here
vm.discovery = false;
});

我可以假设由 radioStatus 更改触发的所有方法都将在转到下一行之前完成(即 vm.discovery = false) ?

我担心的是,vm.discovery 是一个标志,被多个监视变量使用(与 radioStatus 的方式相同),它会在监视变量的功能完成。

最佳答案

是的,观察者是异步的。引用:https://vuejs.org/guide/computed.html#Watchers

引用自上面的链接:

Watchers

While computed properties are... This is most useful when you want to perform asynchronous or expensive operations in response to changing data.

在您上面的例子中,vm.discovery = false; 将在进入 watch 之前完成。如果您将 vm.discovery 设置为 false,那么您在 radioStatus 中的 ajax 调用将始终得到执行。

为避免这种情况,您可以按如下方式尝试 vm.$nextTick():

$.ajax({url: "/api", cache: false})
.done(function(response) {
vm.discovery = true;
vm.radioStatus = response.radio.ison;
vm.$nextTick( () => {
console.log("Setting vm.discovery to false");
vm.discovery = false;
});
});

这又是一件棘手的事情 - 因为 watch 中的 radioStatus() 回调也将仅在 nextTick 中发生.但假设 watch 是由前一行本身触发的 (vm.radioStatus = ...),从技术上讲,它应该首先进入队列,因此更早完成。您必须使用一系列 console.log 语句进行确认。

关于javascript - watch 是异步的吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40321994/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com