reac-redux使用

Posted 2022-11-05 鲨鱼小猫

• 创建store
• store/index.ts

import  createstore  from "redux";
import  reducer  from " xxx/reducer";
export default createstore(reducer);

• App.ts中引入store

import store from "xxx/store/index" ;
import  Provider  from "react-redux" ;
import A from 'xxx/a.ts'
import B from 'xxx/b.ts'

export default function App()
    return(
        <Provider store=store>
            <div>
                <A>
                <B>
            </div>
        </Provider>
    )

• a.ts

    function A(props)
        return <button onClick=props.dispatch>点击</button>
    
    const mapDispatchToprops = dispatch => 
        return
            sendAction: () => 
                dispatch(
                    type:"add_ action"
                );
            
        
    
    export default connect(,mapDispatchToprops)(A);

• b.ts

import  connect  from "react-redux" ;
function B()
    return(
        <p>this.props.xxxx</p>
    )

const mapstateToProps = state =>  
    return state;

export default connect(mapStateToProps)(B);