redux-thunk学习笔记

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { Provider } from 'react-redux'
import { createStore ,applyMiddleware} from 'redux'
import logger from 'redux-logger'
//logger记录用户操作日志!!!!!!!!!!!!!
import thunk from 'redux-thunk'
//thunk处理异步类似vuex中的action!!!!!
// import xxx from './reducers/index'
import RooterReduce from './reducers/merge'
///////////////////////////////////////////////
//action.js
import {JIA, JIAN} from '../constant/const'
// export const add = () =>{
//     return {
//         type:JIA
//     }
// }
//thunk 模拟异步请求,可以调用多个如:dispatchEvent(dispatchEvent)
//!!!就像vuex里的store.dispatch({...})
export function add (){
    return dispatchEvent =>{
        setTimeout(()=>{
            dispatchEvent({
                type:JIA
            })
        },1000)
    }
}

export const minux = (dispatchEvent) => {
    return {
        type:JIAN
    }
}
///////////////////////////////////////////////

const store = createStore(RooterReduce,applyMiddleware(logger,thunk))
// store.subscribe(() => console.log(store.getState()))

ReactDOM.render(
    <Provider store={store}>
        <App/>
    </Provider>
    ,
    document.getElementById('root')
)





// const rendeFn = () => {
//     ReactDOM.render(<App 
//         onAdd={()=>{store.dispatch({
//             type:'JIA'
//         })}}
//         onMuni={()=>{store.dispatch({
//             type:'JIAN',
//             num:5
//         })}}
//         value={store.getState()}
//         />, document.getElementById('root'));
// }
// rendeFn()

// store.subscribe(rendeFn)



发布了18 篇原创文章 · 获赞 3 · 访问量 1955

猜你喜欢

转载自blog.csdn.net/qq_42220283/article/details/104686810