0

我有一个使用 immutablejs 进行反应和 redux 的项目。它看起来像这样：

页面如下所示：

function mapStateToProps(state) {
return {
    content: state.content
 }
}

function mapDispatchToProps(dispatch) {
    return {
        actions: bindActionCreators(thunks, dispatch)
    };
}


class ConnectedConnect extends Component {

 componentDidMount() {
    const { actions } = this.props
    actions.retrieveContent();
    console.log(this.props.content)
}
render() {
    return (
        <div>
            <Header heading="Demo Heading" colour="orange" disableAnimation={false} />

        </div >
    );
    }
}

`const Content = connect(mapStateToProps, mapDispatchToProps)`(ConnectedConnect);

export default Content

api：

export function viewContent() {
    return fetch("http://localhost:8080/watchlist/content",
        {
            method: "GET",

        }).then(function (response) {
            if (!response.ok) {
                throw Error(response.statusText);
            }
            // Read the response as json.)
            return response.json();
        })
        .catch(function (error) {
            console.log('Looks like there was a problem: \n', error);
        })

}

行动：

export function contentSuccess(retrieveContentWasSuccessful) {
    return { type: types.RETRIEVE_CONTENT_SUCCESS, contentSuccess };
}

export function retrieveContent() {
    // make async call to api, handle promise, dispatch action when promise is resolved
    return function (dispatch) {
        return viewContent().then(retrieveContentWasSuccessful => {
            dispatch(contentSuccess(retrieveContentWasSuccessful));
        }).catch(error => {
            throw (error);
        });
    };
}

减速机：

export function contentReducer(state = fromJS({}), action) {
    switch (action.type) {
        case types.RETRIEVE_CONTENT_SUCCESS:
            return state.merge(action.content)
        default:
            return state;
    }
};

商店本身是这样的：

const history = createBrowserHistory()
const store = createStore(
    connectRouter(history)(rootReducer),
    applyMiddleware(
        routerMiddleware(history),
        thunkMiddleware
    )
);

export { store, history };

api调用成功。但是我似乎无法真正访问商店中的响应！感谢您对此的任何帮助！谢谢！

4

1 回答 1

1

认为你想通过retrieveContentWasSuccessful这里而不是contentSuccess：

export function contentSuccess(retrieveContentWasSuccessful) {
    return { type: types.RETRIEVE_CONTENT_SUCCESS, retrieveContentWasSuccessful };
}
于 2018-06-19T20:00:06.470 回答