用 Redux 或 Mobx 對 React 進行狀態管理

一、Redux

返回目錄

包名	說明	環境	備註
redux		-S
react-redux		-S
redux-thunk		-S
redux-saga		-S

1. react-redux

返回目錄

2. redux-thunk

返回目錄

3. redux-saga

返回目錄

二、Mobx

返回目錄

包名	說明	環境	備註
mobx		-S
mobx-react		-S

1. mobx-react

返回目錄

1. 安裝

   npm i -S mobx mobx-react
   

2. 讓 Babel 支持裝飾器語法
   安裝

   npm install --save-dev @babel/plugin-proposal-decorators
   

   .babelrc.js

   //...省略
   const plugins = [
     //...省略
     [
       "@babel/plugin-proposal-decorators",
       {
         "legacy": true
       }
     ],
     //...省略
   ]
   //...省略
   

3. 解決 Parsing error: Unexpected character ‘@’ 錯誤

   npm i -D babel-eslint
   

   .eslintrc

   module.exports = {
   	"parser": "babel-eslint",
   	//...省略
   }
   

4. vscode 提示錯誤，在 setting 中搜索 experimentalDecorators，勾選即可
   
5. 使用