如何在类方法中处理 redux 道具

Question

在我的反应应用程序中，我使用redux 和redux-thunk。现在我在我的组件中得到props，但我无法访问最新 props in我的组件methods
所以我使用componentWillReceiveProps 使用nextprops 获取最新 道具然后我将nextprops 保存到我的states 但这里的问题是setState是 异步
所以当我在类方法中获取 特定状态 时，获取 prev state 值而不是 nextprops 值保存在状态。但是当我在 类方法 中使用 setInterval 来控制那些 state 获得 最新状态 值时，因为现在保存了 setState 值。下面是我的代码

动作创建者

export function pickup(latlng) {

    return function(dispatch) {
        dispatch({ type: PICKUP_STATE,payload:latlng });
    };

}

减速器

import {
    PICKUP_STATE,
    PICKUP_ADD,
    DROPOFF_STATE
} from '../actions/types';

    export default  (state={},action) => {
        const INITIAL_STATE = {
            pickup: '',
            pickupAdd:''
        };
        switch(action.type) {
            case PICKUP_STATE:
                console.log(action.payload)
                return {...state,pickup:action.payload};
            case PICKUP_ADD:
                return{...state,pickupAdd:action.payload};
            case DROPOFF_STATE:
                return {...state,dropoff:action.payload}
            default:
                return state;
        }
        //return state;
    }

组件

import {
    connect
} from "react-redux";
import * as actions from "../actions"
class Map extends React.Component {
      componentWillReceiveProps(nextprops) {
             if (nextprops.pickupProps !== undefined) {
                 this.setState({
                     pick: nextprops.pickupProps
                 }, () => {
                     console.log(this.state.pick);

                 });
             }
       }
   isPickEmpty(emptyPickState) {
        this.props.pickup(emptyPickState);
    // setTimeout(() =>{ console.log('sdkjlfjlksd',this.state.pick) 
                        },3000);
        console.log(this.state.pick);
   }
}
const mapStateToProps = (state) => {
    // console.log(state.BookingData.pickup);
    return {
        pickupProps:state.BookingData.pickup,
        pickupAddProps: state.BookingData.pickupAdd
        }
}
export default connect(mapStateToProps,actions)(Map);

应用根目录文件

import React        from "react";
import ReactDOM     from "react-dom";
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import "normalize.css/normalize.css"
import  "./styles/styles.scss";
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
import reduxThunk from 'redux-thunk';
import { composeWithDevTools } from 'redux-devtools-extension';

import AppRouter from './routers/AppRouter';
import reducers from './reducers';
import {AUTH_USER} from "./actions/types";


const middleware = [
    reduxThunk,
];

const store = createStore(reducers, composeWithDevTools(
    applyMiddleware(...middleware),
// other store enhancers if any
));



const token = localStorage.getItem('token');
if(token){
    store.dispatch({type:AUTH_USER});
}

ReactDOM.render(
    <Provider store={store}>
        <AppRouter />
    </Provider>
    , document.getElementById('app'));

1- 如何在我的 类方法
中访问 latest props 或
2- 我如何在我的 类方法
中访问 nextprops setState 值 或
3- 任何最好的方法来解决这种情况

请任何人帮助我摆脱这种情况，我被困在 3 天后

Answer 1

如果我理解正确，您仍然需要添加地图以调度以从商店获取更新的状态。仍然需要调用动作创建者，然后使用 componenetsDidMount 将其挂载到您的类方法中

  componentDidMount() {
    this.props.fetchPickUp();
  }

const mapDispatch = dispatch => {
  return {
    fetchPickUp: () => dispatch(pickUp()),
  };