[Ngày 1] Nhật ký Redux - React Native

redux

24

lotus viết ngày 16/06/2017

Thành phần

Có 3 thành phần chính trong redux:

• Store: Lưu trữ các trạng thái(State) của ứng dụng
• Action: Hành động của người dùng
• Reducer: Thay đổi State dựa vào Action

Viết code

Tạo store

install redux

npm i -S redux

import {createStore} from 'redux
let initialState = 0
const store = createStore(reducer, initialState) 

vì store nhận vào reducer nên giờ ta tạo reducer

const reducer =  function(state, action){
    return state
}

Run

console.log(store)

Ta sẽ thấy store có các thành phần là:

• dispatch: nhận vào 1 hàh động(action)
• getState: trả về các trạng thái của ứng dụng
• replaceReducer: thay thế reducer
• subscribe: lắng nghe action

Để dễ hình dung bạn nhìn đoạn code dưới đây:

import {createStore} from 'redux'

const reducer = function(state=0, action){
    if(action.type === 'INC')
        return state + 1
   return state
}

let initialState = 0
const store = createStore(reducer, initialState)

store.subscribe(()=>{
    console.log('Current State: ' + store.getState())
})

let action = {type: 'INC'};
store.dispatch(action);

Kết quả:

Current State: 1