在小程序开发中使用redux

• createStore : 是redux里面的一个方法，它绑定一个方法后返回一个store,这个方法是 reducer
• reducer : 其实是一个接收redux返回数据的方法，通过store的dispatch方法传递一个变量，这个变量就是reducer要接收的数据
• subscribe : 是一个监听方法，在页面调用一次后就不需要再调用，二次调用会解除监听。而每次store的数据发生变化时这个subscribe就会响应，此时可以获取store的状态树，然后设置给页面
• combineReducers/createStore 绑定reducer方法到redux和返回一个程序唯一的store

 const store = createStore(combineReducers(reducer))

流程图如下:

redux可以存储程序的所有数据，通过getState()就能获取。
如果你想给redux发送数据，比如你要更新一个页面上面的文本，想把一改成二。你可以调用

dispatch({type: CHANGE_TEXT,data: '二'});

但是这样还不能把它存储进redux的state里面，更别说显示了。
所以需要一个reducer方法，

home_reducer(state,action)
{
  switch(action.type)
  {
   case CHANGE_TEXT:
   retuen Object.assgin({},state,{data: action.data})
  }
}

这样就可以存进state里面。
在页面里面获取任何位置都可以调用到这个数据
通过

store.getState().home_reducer

这里的store必须在程序里只能有一个，所以可以把它的创建写在一个项目全局方法

app.js

里面方便调用。
看似可以的其实这还只能实现手动调用而已。我们知道小程序会在page的data发生改变时更新ui，那么我们还必须实时获取这个state才行，redux给我们提供了一个接口方法：

subscribe

它在小程序里是这样使用的

onLoad: function (options) {
    this.unsubscribe = store.subscribe(() => {  // 当state改变时触发
      this.setData(store.getState().home_reducer) //setData()为专门设置page 的 data用的，它这句的意思是获取state的数据
      console.log(store.getState().home_reducer)
    })
    //app.field_onload()
  }

这样就完成了绑定redux到项目 － 创建action － 创建reducer － 获取state数据并设置给page的这么一个流程。
接下来是一个例子：

var reducer = require('./reducer/index') //引入reducer
const {createStore, combineReducers, applyMiddleware} = require('libs/redux.js') //引入redux接口
const store = createStore(combineReducers(reducer)) //创建store

App({
  store
}) // 绑定到全局的app.js

reducer结构：

var  home_reducer= require('./field/reducer') // reducer
module.exports = {home_reducer} // 可以引用多个reducer

home_reducer文件：

var data = {
text: '一'
}

function home_reducer(state, action) {
    if (state == undefined)
        return data
    switch (action.type) {
               case CHANGE_TEXT:
           return Object.assgin({},state,{text: action.text});
           default: return state
     }
}

homePage.js：

var store = getApp().store
onLoad: function (options) {
    this.unsubscribe = store.subscribe(() => {  // 当state改变时触发
      this.setData(store.getState().home_reducer) //setData()为专门设置page 的 data用的，它这句的意思是获取state的数据
      console.log(store.getState().home_reducer)
    })
  },

// 一个按钮的点击事件响应方法
       on_button_click: function(){
          store.dispatch({ type: 'CHANGE_TEXT' , text: '二' }) ;
       },
// 你还需要在页面退出的时候关闭这个监听
  unOnLoad: function(){
    this.unsubscribe()
     }
   }