no message

redux/redux-reactRedux/src/components/count/index.js

@@ -1,43 +0,0 @@
-/*
- * @Author: chenxuan
- * @Date: 2022-06-21 23:45:51
- * @LastEditTime: 2022-06-26 20:04:33
- * @LastEditors: chenxuan
- */
-import React,{Component} from 'react'
-export default class Count extends Component{
-    increement=()=>{
-        const {value}=this.selectNumber
-        this.props.jia(value*1)
-    }
-    decreement=()=>{
-        const {value}=this.selectNumber
-        this.props.jian(value*1)
-    }
-    increementOdd=()=>{
-        const {value}=this.selectNumber
-        if(this.props.count%2!==0){
-            this.props.jia(value*1)
-        }
-    }
-    increementSync=()=>{
-        const {value}=this.selectNumber
-        this.props.jiaAsync(value*1,1000)
-    }
-    render(){
-        return(
-            <div>
-                <h1>当前求和为：{this.props.count}</h1>
-                <select name="" id="" ref={c=>this.selectNumber=c}>
-                    <option value="1">1</option>
-                    <option value="2">2</option>
-                    <option value="3">3</option>
-                </select>
-                <button onClick={this.increement}>+</button>
-                <button onClick={this.decreement}>-</button>
-                <button onClick={this.increementOdd}>计数再加</button>
-                <button onClick={this.increementSync}>异步再加</button>
-            </div>
-        )
-    }
-}

redux/redux-reactRedux/src/containers/count/index.jsx

@@ -1,6 +1,41 @@
-import countUI from '../../components/count'
+import React,{useRef } from 'react'
 import {connect} from 'react-redux'
 import {createIncreementAction,createDecreementAction,createIncreementAsyncAction} from '../../redux/action/count'
+function Count(props){
+    const selectNumber = useRef(null);
+    const increement=()=>{
+        const value=selectNumber.current.value
+        props.jia(value*1)
+    }
+    const decreement=()=>{
+        const value=selectNumber.current.value
+        props.jian(value*1)
+    }
+    const increementOdd=()=>{
+        const value=selectNumber.current.value
+        if(props.count%2!==0){
+            props.jia(value*1)
+        }
+    }
+    const increementSync=()=>{
+        const value=selectNumber.current.value
+        props.jiaAsync(value*1,1000)
+    }
+    return(
+        <div>
+            <h1>当前求和为：{props.count}</h1>
+            <select name="" id="" ref={selectNumber}>
+                <option value="1">1</option>
+                <option value="2">2</option>
+                <option value="3">3</option>
+            </select>
+            <button onClick={increement}>+</button>
+            <button onClick={decreement}>-</button>
+            <button onClick={increementOdd}>计数再加</button>
+            <button onClick={increementSync}>异步再加</button>
+        </div>
+    )
+}
 
 // 写法1
 // const mapStateToProps=state=>({count:state})
@@ -9,7 +44,7 @@ import {createIncreementAction,createDecreementAction,createIncreementAsyncActio
 //     jian:data=>dispatch(createDecreementAction(data)),
 //     jiaAsync:(data,time)=>dispatch(createIncreementAsyncAction(data,time)),
 // })
-// const CountContainer=connect(mapStateToProps,mapDispatchToProps)(countUI)
+// const CountContainer=connect(mapStateToProps,mapDispatchToProps)(Count)
 
 // 写法2
 // const CountContainer=connect(
@@ -20,7 +55,7 @@ import {createIncreementAction,createDecreementAction,createIncreementAsyncActio
 //             jiaAsync:(data,time)=>dispatch(createIncreementAsyncAction(data,time)),
 //         })
 //     )
-//     (countUI)
+//     (Count)
 
 // 写法3
 const CountContainer=connect(
@@ -31,5 +66,5 @@ const CountContainer=connect(
         jiaAsync:createIncreementAsyncAction,
     }
 )
-(countUI)
+(Count)
 export default CountContainer