In vue's official docs I found the usage about $root
at the edge cases section. "Edge Cases" makes me feel like using this.$root
(or this.$parent
) to mutate the data of root instance in a child component is not a normal or recommended way.
I know vuex is the best state management option for large and complex vue application and it has more advanced features and better for debugging. But that does not convince me the this.$root
is not good.
As the docs says when this.$root
to mutate root data is not possible to track when and where data changes happen and is not good for debugging. But what I want to know is:
Is this.$root
approach only has disadvantages about debugging? Except for debugging related problems, is there any other issue of using this.$root
to mutate the root data? If so can anyone give me a small example to showcase that problem because I cannot think out any case to avoid using it (suppose my vue app is not that large and complex). Thanks in advance!