Sum

day28/react-sum/src/components/Sum/index.jsx

@@ -1,13 +1,14 @@
 import React, { Component } from 'react'
+import store from '../../redux/store';
 
 export default class Sum extends Component {
-  state = { count: 0, };
-
+  componentDidMount() {
+    store.subscribe(() => this.setState({}));
+  }
   render() {
-    const { count } = this.state;
     return (
       <div>
-        <h1>当前求和为：{count}</h1>
+        <h1>当前求和为：{store.getState()}</h1>
         <select ref={c => this.selectNum = c}>
           <option value="1">1</option>
           <option value="2">2</option>
@@ -22,24 +23,20 @@ export default class Sum extends Component {
   }
   add = () => {
     const { value } = this.selectNum;
-    const { count } = this.state;
-    this.setState({ count: count + value * 1 });
+    store.dispatch({ type: "increment", data: value * 1 });
   }
   dec = () => {
     const { value } = this.selectNum;
-    const { count } = this.state;
-    this.setState({ count: count - value * 1 });
+    store.dispatch({ type: "decrement", data: value * 1 });
   }
   odd = () => {
     const { value } = this.selectNum;
-    const { count } = this.state;
-    this.setState({ count: count % 2 !== 0 ? count + value * 1 : count });
+    if (store.getState() % 2 !== 0) store.dispatch({ type: "increment", data: value * 1 });
   }
   async = () => {
     const { value } = this.selectNum;
-    const { count } = this.state;
     setTimeout(() => {
-      this.setState({ count: count + value * 1 });
+      store.dispatch({ type: "increment", data: value * 1 });
     }, 1000)
   }
 }