Dva的数据流向

Dva中的数据流向：

数据的改变通过是通过用户交互行为或者浏览器行为(如：路由跳转等)触发的。
图解：

描述：
当此类行为会改变数据的时候，可以通过dispatch发起一个action:
(1)同步行为------>直接通过reducers改变state
(2)异步行为------>先触发effects然后流向reducers最终改变state。

Model中的参数：

State 表示状态数据，是一个对象。
Action 是一个普通的JavaScript对象，它是改变State的唯一路径。无论是UI事件、网络回调，还是WebSocket等数据源所获取的数据，最终都会通过dispatch函数调用一个action，从而改变对应的数据。action必须带有type属性指明具体的行为，其他字段可以自定义，如果要发起一个action需要使用dispatch函数；dispatch是在组件connect Models以后，通过props传入的。

this.props.dispatch({
    type:''
})

dispatch 函数用于触发action的函数，action是改变state的唯一途径，但是它只描述了一个行为，而dispatch可以看作是触发这个行为的方式，而reducer则是描述如何改变数据的。
Subscription 订阅，用于订阅一个数据源，然后根据条件 dispatch 需要的 action。数据源可以是当前的时间、服务器的 websocket 连接、keyboard 输入、geolocation 变化、history 路由变化等等。

Model中的数据：例子

import {reqCnode} from '../services/example'
export default{
    namespace:'IndexText',
    state:{
        name:'西柚',
        cNodeData:[]
    },
    reducers:{
        setName(state,payLoad){
            let _state = JSON.parse(JSON.stringify(state));
            _state.name = payLoad.payLoad.name;
            return _state;
        },
        setCnodeData(state,payLoad){
            let _state = JSON.parse(JSON.stringify(state));
            _state.cNodeData = payLoad.data
            return _state;
        },
        testSubscript(state,payLoad){
            console.log('我是用户页面')
            return state
        }
    },
    effects:{
        *reqCnodeFn({payLoad},{put,call}){
            const result = yield call(reqCnode);
            if(result.data){
                yield put({
                    type:'setCnodeData',
                    data:result.data.data
                })
            }
        }
    },
    subscriptions:{
        hello({dispatch,history}){
            history.listen(({pathname})=>{
                if(pathname === '/user'){
                    dispatch({
                        type:'testSubscript'
                    })
                }
            })
        }
    }
}

---

觉得对自己有帮助就点个赞👍呀。