Нека първо разберем какво е държава?

💡С прости думи можем да кажем, че това са текущи данни, които са необходими на нашия компонент, за да го изобрази на екрана.

Можем да споделяме данни между компонентите, като използваме събития и подпори.

За големи приложения обработката на тази дървовидна структура ще се усложни, така че можем да използваме управление на състоянието на Vuex магазин, така че тук ще създадем единичен магазин за поддържане на състоянието, т.е. единствен източник на истина.

🗃️ Vuex Store

Vuex store е глобално състояние, откъдето всеки компонент има достъп до данни, без да е необходимо да се обмисля горен и нисък възел на дървото.

Ако някой компонент актуализира състоянието, тогава други компоненти ще получат актуализирано състояние незабавно.

какво се случва, ако много компоненти се опитат да променят състоянието си?

Така че тук моделите за управление на състоянието носят условия за Мутация и действия.

⚙️ Мутации: Името му ни подсказва, че е отговорен за мутирането на текущото състояние на обекта.

📋 Действия: Действието не трябва да променя състоянието директно, а да извиква мутациите. Може да предизвика множество мутации.

⛏️ Getters: Работи като изчислена собственост за магазини.

Нека вземем пример, за да разберем по-ясно -

В нашия стар имот имаме множество студенти.

По-долу мутациите на setStudents ни позволяват да актуализираме масив от ученици, който ще получим от извикване на API в нашето действие по-долу.

Тогава в нашите действия имаме няколко стъпки:

първо правим api извикване, след което извършваме setStudents мутация с текущия api отговор.

И ще получим актуализиран API отговор с помощта на gettters.

Надяваме се, че единственият източник на истина е полезен за вас 😄
Кажете ми, ако искате други статии от този тип тук 📪