----flux----

一、flux由四部分組成

    （1）view：視圖層

    （2）action：發出的動做，視圖層發出的動做，onClick等

    （3）dispatcher：派發器，用來接收action，進行相應的數據處理

    （4）store：數據層，用來存放狀態，一旦發生改變，就會通知視圖層

 

flux的數據流程

 

一、view層的數據想進行修改，會給dispatcher發送一個action

    經過dispatcher.dispatch來發送action

    dispatcher.dispatch({

        type:"",

        value:

    })

二、dispatcher之中接收到action，進行對比，要求store進行相應的數據更新

    import {Dispatcher} from "flux"

    const dispatcher=new Dispatcher()

    dispatcher.register((action)=>{

        switch(action.type){

            case "":

            store.事件名稱

        }

    })

三、store中進行數據處理，建立一個函數，在函數內部進行事件的監聽供view層調用，觸發的時候進行數據的改變

    handleUpdate(fn){

        this.on("update")

    }

四、在組件中調用事件監聽的方法進行修改數據

    store.handleUpdate(this.handleUpdate.bind(this))

    handleupdate(){

        this.setState(store.getState())

    }

 

store是手動建立的

 

import EventEmitter = require("events")

const store =Object.assign({},EventEmitter.prototype,{

    state:{}

    getState(){

        return this.state

    }

})

 

export default store