npm i redux react-redux redux-thunk redux-devtools-extension

----store                 // redux相關(guān)存放文件夾
    ---index.js           // redux出口文件
    ---actions/模塊.js    // 存放組件中dispatch的函數(shù)
    ---actionTypes.js     // 存放dispatch攜帶的type常量
    ---reducers/index.js  // 主要用來合并模塊并導出store
    ---reducers/模塊.js   // store中模塊的reducers

/*
    1.定義初始狀態(tài)，初始狀態(tài)要根據(jù)實際業(yè)務確定（慎重），根據(jù)實際業(yè)務確定初始狀態(tài)是數(shù)組還是對象
    2. 導出一個reducers的函數(shù) 并設置默認狀態(tài) 下面天譴寫好Swatch的格式
*/
const initChannels = {
  activeId: 0,
  channels: []
}
 
export default function Channels (state = initChannels, action) {
  switch (action.type) {
    case action.type:
      return action.type
    default:
      return state
  }
}

/*
      1.從redux中導入合并reducers中的方法
      2.導入相關(guān)模塊進行合并導出 
*/
 
import { combineReducers } from 'redux'
import Channel from './Channel'
import NewsList from './NewsList'
 
export default combineReducers({
  Channel,
  NewsList
})

// 1.導入創(chuàng)建store的方法和中間件的方法
import { createStore, applyMiddleware } from 'redux'
// 2.導入thunk使dispatch內(nèi)部可以寫函數(shù)
import thunk from 'redux-thunk'
// 3.導入redux調(diào)試工具
import { composeWithDevTools } from 'redux-devtools-extension'
// 4.導入reducers并掛載
import rootReducers from '@/store/reducers'
/* 5.創(chuàng)建store
    第一個參數(shù)是reducers第二個參數(shù)是先注冊
    第二個參數(shù)先使用redux調(diào)試工具最外層包裹 在使用中間件對thunk進行包裹
*/
export default createStore(
  rootReducers,
  composeWithDevTools(applyMiddleware(thunk))
)