StateとPropsの違い（React）

ReactのStateとPropsの違いがよくわからなかったのでメモ

State

変更可能
そのコンポーネント自体が値を持っている
setStateで更新することができる

＊Propsだけでできなかった時に使うようにする（なるべく使わない）

Props

外部からもらう値
Readオンリー（変更不可）→通信が早い

「mapStateToProps」と「mapDispatchToProps」

mapStateToProps
・stateの値をcompornentのpropsに入れる

mapDispatchToProps
・グローバルステート:React-reduxのstate
・React コンポーネントのツリーの一番上流（Buttonとか）

connect
connectを使うことで、親→子ではなく親→孫、ひ孫...にも渡すことができるようになる

const mapStateToProps = ({ app, taskSubscription }) => ({
  isLoading: app.isLoading,
  taskSubscription: taskSubscription.selected
})

const mapDispatchToProps = dispatch => ({
　//ページタイトルはこのサービス内全てで共通
  setPageTitle: pageTitle => dispatch(setPageTitle(pageTitle)),
})

export default connect(　　//ここで渡す
  mapStateToProps,
  mapDispatchToProps)

（メモ）exportとは？
定義したものを外部からインポートできるようにする
defaultありとなしではimportの仕方が異なる。
defaultは1つのファイルに一つしか定義できない

export default AAA
→import AAA from './sample.js'

export BBB
→import { BBB } from './sample.ls'
*{}をつける