Vuex je state knihovna pro správu Vue.js aplikací, která vám umožňuje spravovat a synchronizovat data napříč různými component s ve vaší aplikaci. Vuex implementuje architekturu Flux, což usnadňuje a zefektivňuje správu aplikace state.
Mezi klíčové pojmy Vuex patří
1. State
Vstup představuje centralizované úložiště dat pro vaši aplikaci state. Vuex Obsahuje data aplikace, která je třeba sdílet mezi různými component s. Zde je příklad definice state v Vuex:
2. Mutations
Mutations jsou zodpovědní za úpravy state v Vuex. state Jsou to synchronní funkce, které jako argumenty berou aktuální a užitečné zatížení. Zde je příklad definice mutace v Vuex:
3. Actions
Actions se používají ke zpracování asynchronních operací a odeslání mutations k úpravě souboru state. Mohou obsahovat volání API, asynchronní úlohy nebo složitou logiku. Zde je příklad definování akce v Vuex:
4. Getters
Getters vám umožní načíst a vypočítat odvozené state z Vuex obchodu. Jsou užitečné pro přístup k datům a manipulaci s nimi před jejich vrácením do component s. Zde je příklad definice getteru v Vuex:
Chcete-li nainstalovat Vuex do svého Vue.js projektu, můžete postupovat podle těchto kroků
Krok 1: Instalace Vuex přes npm nebo přízi:
nebo
Krok 2: Vytvořte store.js
soubor v kořenovém adresáři vašeho projektu. Zde budeme deklarovat a spravovat aplikaci state.
Krok 3: V store.js
souboru importujte Vuex a vytvořte nový objekt úložiště:
Krok 4: V main.js
souboru importujte obchod a propojte jej s vaší aplikací Vue:
Krok 5: Nyní jste nainstalovali a nastavili Vuex váš projekt. state Své s, getters, mutations a můžete deklarovat actions v store.js
souboru a používat je ve svých Vue component s.
Příklad:
V store.js
souboru můžete deklarovat jednoduchou state a mutaci takto:
Ve Vue component můžete použít state mutaci a pomocí funkcí a : mapState
mapMutations
Pomocí těchto kroků jste úspěšně nainstalovali Vuex a můžete je použít ke správě state vaší Vue.js aplikace.
S Vuex aplikací můžete snadno a konzistentně spravovat aplikaci state. Zlepšuje udržovatelnost a znovupoužitelnost kódu a zároveň poskytuje strukturovaný přístup ke správě dat.