To be honest, I wasn't sure what I was writing when I wrote the previous article about Vuex State and Getters. And the more I use Vuex, the more I question this "everything in Getters" proposition. In the end, writing this article allowed me to review the situation.
I know why something did not smell right to me.
The case of the Vuejs components
Several data are accesible within a component, they can come from props, be defined in data or be calcultated in computed.
When we use them in the teplate, we don't ask ourselves the question of their origins, they are all accessible through the this interface.
There are two interfaces: this.state and this.props. The first handles internal data of the component. The second handles external data of the component whether it comes from the calling component or the state manager.
Whether the data is directly provided by the state of the store, or the data is derived, we don't have the same interface: this.state vs this.getters. And the consumer of the data has to be aware of the internal organization of the store, which is a bit disturbing.
To access the todos, components can add a computed properties:
The case of Redux
Getters are referred to as Selectors and handle providing derived data. In a redux vanilla framework, we will implement a function well-named mapStateToProps (transforming a data of the global state into a component's props property).
React and Redux don't do something special for computed properties or getters, they are only functions that take a raw data as a parameter and return a computed data.
Vuejs and Vuex treat computed properties and getters in a special way that force developers to adapt their code to the framework (in order to be reactive):
The Vuejs component that consumes a Vuex data must know how the state is organised;
Developers need to know the correct interface to access the state data regarding if they are raw or computed data.
Top comments (0)
Subscribe
For further actions, you may consider blocking this person and/or reporting abuse
Top comments (0)