【React.js 11】React自动连接Redux（装饰器方法）

上一篇【React.js 10】React自动连接Redux文章中，已经实现了自动连接，这边，再提出一个用装饰器的方法来书写的案例。

首先，我们需要一个额外的插件，所以，需要自己配置一下package.json中的插件，由于我们使用脚手架创建的项目，要实现自定义配置，就要先弹出个性化配置：

npm run eject

然后安装一个支持装饰器的插件：

npm install babel-plugin-transform-decorators-legacy --save-dev

打开package.json文件，找到babel的配置处，配置插件：

  "babel": {
    "presets": [
      "react-app"
    ],
    "plugins": [
      "transform-decorators-legacy"
    ]
  }

可以修改代码了：

/* 修改前
//状态映射属性 
// const mapStatetoProps = (state)=>{
//   //需要哪些状态数据
//   return {num : state}
// }
//需要执行的方法
// const actionCreator = { hire, hireAsync ,fire }

// App = connect(mapStatetoProps ,actionCreator)(App)
*/

// 修改后
@connect(
  //需要哪些状态数据
  state=>({num : state}),
  //需要执行的方法，自动dispatch
  { hire, hireAsync ,fire }
)

Redux基础使用就是这些了，后面还会有更详细的更复杂的使用介绍，敬请期待。