【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基本使用はこれらですが、後でもっと詳しくもっと複雑な使用紹介がありますので、ご期待ください.