我有这个Vue.js代码:
new Vue({
data:{
myValue:'x',
myOtherValue:'y'
},
computed: {
myComputed: myFunction(){
return this['my' + 'Value']
}
}
})
如您所见,calculated属性将被缓存,并且仅取决于data.myValue
。我的问题是Vue.js缓存系统如何知道仅在myValue
更改后才再次运行计算函数?
如果更改myOtherValue
变量,则该myComputed
函数将使用缓存,而我将其调用后将不会再次运行。
我考虑了几种可能的方法。但是Vuejs是如何做到的?我已经阅读了这篇文章:https : //vuejs.org/v2/guide/computed.html,没有找到答案。
这段代码中发生了什么,将要依靠什么?
const flag=2
new Vue({
data:{
myValue:'x',
myOtherValue:'y'
},
computed: {
myComputed: myFunction(){
if (flag==1){
return this['my' + 'Value']
}
else
return this['my' + 'Other' + 'Value']
}
}
})
奖励:我将感谢我链接到VueJS代码中的相关功能:https : //github.com/vuejs/vue
从文档中读取到:缓存了计算的属性,并且仅在响应依赖项更改时重新计算了属性。但是,下面的小提琴显示出一些不同之处。
如果您将标志设置为2,从小提琴开始,如果您更改
myOtherValue
,则将重新计算并执行计算属性,但是如果将标志设置为1,则不会发生这种情况。我认为它会跟踪您的if条件。通常,在文档中,您可以找到相关源代码的链接。这是计算属性的代码: