add new code

project/package.json

@@ -8,6 +8,7 @@
     "babel-plugin-transform-decorators-legacy": "^1.3.5",
     "css-loader": "^3.6.0",
     "fyge-tbmini": "^1.3.1",
+    "mobx": "^6.0.4",
     "postcss-loader": "^3.0.0",
     "prettier": "^2.0.5",
     "qs": "^6.9.4",

project/src/components/AUPop/AUPop.jsx

@@ -88,5 +88,5 @@ class AUPop extends Component {
   }
 }
 
-// 到处被 connect 包装的组件，共享 state 的状态
+// 被 connect 包装的组件，共享 state 的状态
 export default AUConnect(AUPop)
\ No newline at end of file

project/src/components/pop/PopRotate/PopRotate.jsx

@@ -3,7 +3,6 @@
 import React, { Component } from 'react';
 import resList from '../../../resconfig/resList';
 import { debounce } from '../../../utils/debounce.js'
-import { getPxToken } from '../../../utils/spark_gettoken'
 
 // Redux
 import store from '../../../redux/store';

project/src/mobx/apiFunction.js

+import { showPop } from '../redux/action'
+import popState from './mobxState'
+
+const showPop1 = () => {
+
+}
+
+const showPop2 = () => {
+  
+}
+
+const test01 = (num) => {
+  popState.popStateAdd(num)
+}
+
+// export default showPop1
+// export default showPop2
+export default test01
\ No newline at end of file

project/src/mobx/index.js

+export { default as AUPOP } from './apiFunction'
\ No newline at end of file

project/src/mobx/mobxState.js

+// 'use strict';
+
+// import { observable, action, decorate } from "mobx";
+import { makeAutoObservable, observable, computed, action } from 'mobx'
+
+class PopState {
+
+  constructor() {
+    makeAutoObservable(this, {
+      nowShow: observable,
+      computed4test: computed,
+      add: action
+    })
+  }
+
+  nowShow = 0
+
+  popArr = []
+
+  add = (num) => {
+    this.nowShow += num
+  }
+
+  computed4test = () => {
+    console.log('nowShow is: ', this.nowShow)
+    return `nowShow is : ${this.nowShow}`
+  }
+}
+
+const AUPopState = new PopState()
+
+const popStateAdd = (num) => {
+  AUPopState.add(num)
+}
+
+export default {
+  popStateAdd
+}

project/src/pages/PageHome/PageHome.jsx

@@ -5,6 +5,8 @@ import { Random } from 'mockjs';
 import { AUConnect } from '../../redux/auConnect';
 import { debounce } from '../../utils/debounce';
 
+import { AUPOP } from '../../mobx/index'
+
 import './PageHome.less';
 
 class PageHome extends Component {
@@ -59,6 +61,10 @@ class PageHome extends Component {
     })
   }
 
+  mobxAction01 = () => {
+    AUPOP.test01(1)
+  }
+
   openColorful = () => {
     this.props.showPop({type: 'PopLightCard', data: {sindex: 3, addSignDays: 18}, ctx: this})
   }
@@ -68,13 +74,15 @@ class PageHome extends Component {
       <div className="home">
         <div className="home_title">pageHome</div>
         <div className="home_button_group">
-          <div onClick={ debounce(this.openDefault, 300) } className="home_button">open pop default</div>
-          <div onClick={ debounce(this.openRule, 300) } className="home_button">open pop rule</div>
-          <div onClick={ debounce(this.openInput, 300) } className="home_button">open pop input</div>
-          <div onClick={ debounce(this.openRotate, 300) } className="home_button">open pop rotate</div>
-          <div onClick={ debounce(this.openInfinite, 300) } className="home_button">open pop infinite</div>
-          <div onClick={ debounce(this.openColorful, 300) } className="home_button">open pop colorful</div>
+          <div onClick={ debounce(this.openDefault, 300, 1) } className="home_button">open pop default</div>
+          <div onClick={ debounce(this.openRule, 300, 1) } className="home_button">open pop rule</div>
+          <div onClick={ debounce(this.openInput, 300, 1) } className="home_button">open pop input</div>
+          <div onClick={ debounce(this.openRotate, 300, 1) } className="home_button">open pop rotate</div>
+          <div onClick={ debounce(this.openInfinite, 300, 1) } className="home_button">open pop infinite</div>
+          <div onClick={ debounce(this.openColorful, 300, 1) } className="home_button">open pop colorful</div>
+
         </div>
+        <div onClick={ debounce(this.mobxAction01, 300, 1) } className="home_button_mbox"> mobx test for action </div>
       </div>
     );
   }

project/src/pages/PageHome/PageHome.less

@@ -37,4 +37,13 @@
       overflow: hidden;
     }
   }
+  .home_button_mbox {
+    width: 320px;
+    height: 80px;
+    background-color: beige;
+    font-size: 28px;
+    padding: 10px 30px;
+    text-align: center;
+    line-height: 80px;
+  }
 }

project/src/redux/reducer.js

 import { combineReducers } from 'redux'
-import { ActionType } from './action';
+import { ActionType } from './action'
 
 let stateInitPop = {
   popArr: []