程序代写代做代考 Twitter Bootstrap

Twitter Bootstrap

VueJS:
Vuex

Problem with components…
Component communication so far…
Props down
Events up

Issue: What if the same data is used by different child components?

There are problems with this….
A modification to the state in one component would then require passing up and down the data to align the state
This may also cause multiple re-renders, as state changes in multiple places…
There is not “one source of the truth”, state is duplicated

How do we solve this problem?
Container-presentation component style might solve this issue to some degree…
Container components manage state, use child presentation components that are stateless
Container components in this case, acting as a sort of store, are doing something components weren’t really intended for… i.e. not bad, but a bit of a hack
It also doesn’t end up scaling well… e.g. higher depth trees

…and there are actually some other problems….
We would like to coordinate our API/back-end access
Seperate business logic and presentation logic in this way

Vuex
Vuex
Another Vue-family library
Acts as a centralized data store for all app components
Allows data to only be accessed in pre-defined and predictable ways
Records all transactions for debugging purposes

Vuex is an example of a singleton design pattern
Used when something important is required by all components of a software architecture

5

Vuex
Vuex is a bit like a root Vue instance with no template, specialized to state management
state instead of data
getters instead of computed properties
actions instead of methods
mutations to change state, state changes are recorded and can be analyzed, rolled back

Vuex documentation: https://vuex.vuejs.org/

See examples on eLearn for how it works…

Decision to use Vuex is complex…
there are alternative approaches

Article: https://markus.oberlehner.net/blog/should-i-store-this-data-in-vuex/

What about components?
Wasn’t the whole point about components to separate concerns and modularize our app?

Vuex offers a module feature which gives back some separation of concerns:
https://vuex.vuejs.org/guide/modules.html

But even still… in Kevin’s subjective opinion… it’s a good, fair point… trade-off of using Vuex likely only worth it for medium-large size apps…

/docProps/thumbnail.jpeg