Middle

Консепти идоракунии ҳолат дар JavaScript чӣ гуна аст, ки Vuex иҷро мекунад?

sobes.tech AI

Ҷавоб аз AI

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-ҳои калон, бо маҷбур кардани намунаи "токи маълумоти якнақл".

Гузашта Оянда