React Redux 精簡版

原理

Image Not Showing Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Learn More →

整體流程

在components同層建立redux資料夾
在redux資料夾建立store.js & XXX_reducer.js
- store.js : 基本不修改
- Image Not Showing Possible Reasons
  The image file may be corrupted
  The server hosting the image is unavailable
  The image path is incorrect
  The image format is not supported
  Learn More →
- XXX_reducer.js : 依照邏輯變更從store.js收到的值在回傳給store.js
- Image Not Showing Possible Reasons
  The image file may be corrupted
  The server hosting the image is unavailable
  The image path is incorrect
  The image format is not supported
  Learn More →
要用redux的component(template)引入store
- Image Not Showing Possible Reasons
  The image file may be corrupted
  The server hosting the image is unavailable
  The image path is incorrect
  The image format is not supported
  Learn More →
- 該component : 取得存儲在store.js的state
- 獲取state(狀態)
  - store.getState()
  - Image Not Showing Possible Reasons
    The image file may be corrupted
    The server hosting the image is unavailable
    The image path is incorrect
    The image format is not supported
    Learn More →
- 發出(變更的)要求
  - store.dispatch({type:XXX, data:XXX})
  - Image Not Showing Possible Reasons
    The image file may be corrupted
    The server hosting the image is unavailable
    The image path is incorrect
    The image format is not supported
    Learn More →
當redux的state變化時就會執行
- store.subscribe(()=>{ 這裡會被執行 })
- 用subscribe從最外面包住ReactDOM.render()
- Image Not Showing Possible Reasons
  The image file may be corrupted
  The server hosting the image is unavailable
  The image path is incorrect
  The image format is not supported
  Learn More →
- 也可以在各個component裡面subscribe，只是這種做法有幾個要用就要寫幾次