Computed property is uselessly recomputed when depending on a injected and computed property.
Version
3.0.5
Reproduction link
https://jsfiddle.net/3yw2ghto/10/
Steps to reproduce
Press the two buttons.
What is expected?
The computed property in the child component should not be recomputed when x > 0.
What is actually happening?
The computed property of the child component is recomputed, but it shouldn't (as shown in the browser console).
This seems to happen also with custom directives: the "updated" hook is triggered, even if the value has not changed, and neither the argument, when the binding's value is taken from a computed property depending on injected objects.
About computed
:
That's expected behavior. Computed properties are evaluated lazily, which means: the function is run only once the computed property is actually being read.
As a consequence, if one computed property A depends on another computed property B, and B updates, then A will always update as well - wether or not the new value of B
is actually different to the old one.
About custom directives:
This is also expected behavior, but for a totally different reason: You misunderstand how the updated
hook works. It runs when the component updates, it's not related to the binding.value
at all.