Xóa bài viết
Bạn có chắc chắn muốn xóa bài viết này không ?
Xóa bình luận
Bạn có chắc chắn muốn xóa bình luận này không ?
[Ngày 1] Nhật ký Redux - React Native
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
Bình luận

{{ comment.user.name }}
Bỏ hay
Hay

Cùng một tác giả

11
0
Emmet là gì? Emmet là một plugin cho các code editor phổ biến như Sublime text, atom, bracket,… Emmet giúp việc code html và css nhanh hơn và đ...

9
3
Toán tử 3 ngôi Longhand const x = 20; let big; if (x 10) { big = true; } else { big = false; } Shorthand

3
1
Tôi bắt đầu tự hỏi, rằng có tồn tại không, một kỹ năng giúp ta đối mặt với mọi thứ trong cuộc sống. Nếu có thì nó là gì và làm sao để phát triển?...
Bài viết liên quan

5
2
Trải qua 1 thời gian khá dài trải nghiệm Angular, mình thấy RxJS khá hay. Bài này sẽ quay trở lại với bài toán Counter thần kì của React/Redux, như...

6
2
Chào các bạn Mình vừa mới làm một side project để cập nhật công nghệ mới nhất về React stack. Shopping Cart của mình được build bằng TypeScript, N...

9
5
Chào mừng các bạn trở lại với series (Link), trong (Link) chúng ta đã setup xong project và đã viết được những React component đầu tiên. Trong bài ...