JavaScriptте Vuex кайсы абал башкаруу концепциясын ишке ашырат?

Vuex Vue.js тиркемесинин бардык компоненттери үчүн борборлоштурулган сактагыч концепциясын ишке ашырат.

Vuexтин негизги түшүнүктөрү:

• State: Тиркеменин маалыматтары үчүн бир гана чындык булагы.
• Getters: Stateтен алынган чыгармалар, маалыматтарды эсептөө же фильтрлөө үчүн колдонулат.
• Mutations: Синхрондуу функциялар, алар stateти өзгөртөт. Алар гана stateти өзгөртүүнүн жолу.
• Actions: Асынырдуу операциялар, алар каалаган логиканы камтышы мүмкүн жана mutationsти чакырат.
• Modules: Магазинди кичинекей, өзүн-өзү жетиштүү бирдиктерге бөлүүгө мүмкүндүк берет.

Vuex менен иштөө мисалы:

// mutation
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++
    }
  },
  actions: {
    incrementAsync ({ commit }) {
      setTimeout(() => {
        commit('increment')
      }, 1000)
    }
  },
  getters: {
    doubleCount (state) {
      return state.count * 2
    }
  }
})

// компоненттен mutation чакыруу
this.$store.commit('increment')

// компоненттен action чакыруу
this.$store.dispatch('incrementAsync')

// компоненттен state алуу
this.$store.state.count

// компоненттен getter алуу
this.$store.getters.doubleCount

Vuex структураланган жана алдын ала белгилүү жол менен күйгүзүүчү күйөттү башкарууну камсыздайт, өзгөчө чоң SPAларда, "бир тараптуу маалымат агымын" моделин күчөтүү аркылуу.