Redux的使用

• 和Vuex作用相同，但比Vuex学习成本高
• 不可变值，纯函数
• 面试常考

基本概念

• store state
• action
• reducer

单向数据流

• dispatch(action)
• reducer => newState
• subscribe 触发通知

react-redux

javascript">import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import todoApp from './reducers'
import App from './components/App'let store = createStore(todoApp)export default function () {return <Provider store={store}><App /></Provider>
}

异步action

javascript">export const addTodoAsync = text => {return (dispatch) => {fetch(url).then(res => {dispatch(addTodo(res.text))})}
}

创建store时，作为中间件引入redux-thunk
const store = createStore(rootReducer, applyMiddleware(thunk))

中间件