React Redux Axios-道具可以访问然后不确定

Question

概述：我通过Axios发出GET请求（在本例中为模拟适配器），并通过分派更新我的商店。 只要路径为“ / posts / *”，模拟适配器将发送回相同的响应。

奇特的是，它实际上显示了来自模拟API的道具（持续1秒钟），但是随后它转到了prop是未定义的（即，无法读取未定义的属性“ title”）。

当我登录this.props时，表明这些道具确实存在。 因此，我认为没有任何事情可以将它们恢复为null。

这是axios部分，我目前将其放置在middleware.js中的apiMiddleware函数中

        dispatch({ type: 'GET_POST_AXIOS' });
        let { postID } = action.payload;
        mock.onGet(API_BASE + "/posts/" + postID).reply(200, {
          post:
            { id: 1,
              title: 'Test Title',
              description: 'Test Description',
              media: { medium_url: "http://test.com/test.jpg" }
            }
        });
        axios({
            url: API_BASE + "/posts/" + postID,
            timeout: 20000,
            method: 'get',
            responseType: 'json'
        })
        .then(function(response) {
                dispatch({ type: 'SERVE_POST_AXIOS', response: response.data });
            })

这是减速器部分

case 'SERVE_POST_AXIOS':
  return Object.assign({}, state, { post_axios: response.post })

这在呈现帖子的组件中的mapDispatchToProps中。 match.params来自react-router的BrowserRouter。

loadFromAxios(cb) {
    console.log("Load from Axios called..");
    dispatch({ type: 'API', payload: { success: 'GET_POST_AXIOS', postID: ownProps.match.params.postID } });
        cb();
    }

Answer 1

我通过修改条件来解决了这个问题

this.state.loading ? 
<div>Loading</div>
:
<div>Info here with props</div>

成

this.props.post ?
<div>Info here with props</div>
:
<div>Loading</div>

但是我非常想通过this.state.loading的当前方式来执行此this.state.loading 。 有人有主意吗？

我首先将this.state.loading定义为false，然后这是我的ComponentDidMount

componentDidMount() {
    this.props.loadFromAxios( () => this.setState({ loading: false }) );
}

为什么这不起作用？