Pangerten, lan ing Redux Store Actions Reducers React

Ing aplikasi Redux-powered, arsitektur revolves watara telung konsep utama: ing Redux store, actions, lan reducers. Ayo goleki luwih jero babagan saben konsep kasebut lan deleng kepiye cara kerjane.

Redux Store

Redux store minangka sumber siji bebener sing nduwe status lengkap aplikasi sampeyan. Iku ateges obyek JavaScript sing ngemot data makili kabeh negara aplikasi. Sampeyan nggawe store nggunakake createStore fungsi saka perpustakaan Redux.

Actions

Actions minangka obyek JavaScript biasa sing nggambarake kedadeyan ing aplikasi kasebut. Dheweke nggawa type lapangan sing nuduhake jinis tumindak sing ditindakake, lan data tambahan bisa uga kalebu. Actions digawe nggunakake action creator, yaiku fungsi sing ngasilake obyek tumindak. Tuladhane:

// Action Types  
const ADD_TODO = 'ADD_TODO';  
  
// Action Creator  
const addTodo =(text) => {  
  return {  
    type: ADD_TODO,  
    payload: text  
  };  
};  

Reducers

Reducers nemtokake cara owah-owahan negara aplikasi kanggo nanggepi actions. Reducer minangka fungsi murni sing njupuk kahanan saiki lan tumindak minangka argumen lan ngasilake negara anyar. Reducers digabungake dadi reducer ROOT siji nggunakake combineReducers fungsi kasebut. Punika conto prasaja:

// Reducer  
const todosReducer =(state = [], action) => {  
  switch(action.type) {  
    case ADD_TODO:  
      return [...state, action.payload];  
    default:  
      return state;  
  }  
};  
  
// Combine Reducers  
const rootReducer = combineReducers({  
  todos: todosReducer,  
  // ...other reducers  
});  

Makarya Bareng

Nalika sampeyan ngirim tumindak nggunakake dispatch fungsi kasebut, Redux nerusake tumindak kasebut menyang kabeh file reducers. Saben reducer mriksa yen jinis tumindak cocog karo dhewe lan nganyari bagean negara sing cocog. Negara sing dianyari banjur disimpen ing Redux store, lan komponen sing disambungake maneh adhedhasar negara anyar.

Tuladha Skenario

Mbayangno aplikasi dhaptar todo. Nalika pangguna nambahake todo anyar, tumindak bakal dikirim kanthi jinis ADD_TODO lan teks todo minangka muatan. Reducer todos nampa tumindak iki, nambah todo anyar kanggo negara, lan ngasilake negara dianyari.

Kesimpulan

Ngerteni carane Redux store, actions, lan reducers sesambungan iku penting kanggo manajemen negara sing efektif. Arsitèktur iki njamin pamisahan sing jelas saka masalah lan nggampangake ngatur negara aplikasi sing rumit. Nalika sampeyan terus berkembang karo Redux, konsep kasebut bakal dadi dhasar strategi manajemen negara sampeyan.