Question

现在，我正在使用react和redux，但我发布了http请求，我使用axios发布http请求，并尝试多次或从互联网演示。他们中没有人在我的程序中工作。我只想调用一些API并更新我的组件。

我总是收到错误TypeError getsimpleresult is not a function，并且无法调用此功能，我知道这只是一个小案例。

任何人都可以帮我修复它并给我一个正确的demo.Thanks。

这是我的代码：

reducers.js

const initState = {
    simple_result_value: {}
};

export default function simple_result_reduce(state = initState, action) {
    switch (action.type) {
        case 'query_evaluation_simple_result':
            return {
                ...state,
                simple_result_value: action.simple_result_value
            };
        default:
            return state;
    }
}

action.js

const simpleresultaction = (data) => ({
    type: 'GET_VALUE',
    result_value: data
});


export const getsimpleresult = () => async(dispatch, getState) => {
    try {
        let response = await post_http("/some/api", params);
        await dispatch(simpleresultaction(response.data))
    } catch (error) {
        console.log('HTTP post error: ', error)
    }
};

component.js

import React, {PropTypes, Component} from 'react'
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import * as simpleActions from '../actions/simple_reuslt'

@connect( state => state,dispatch => bindActionCreators({simpleActions}, dispatch) )
export default class Simple_result_component extends Component {
    constructor(props) {
        super(props);
    }

    componentWillMount() {
        this.props.getsimpleresult();
    }

    render() {
        return (
            <header className="header">
            </header>
        )
    }

}

Answer 1

我可以看到你正在使用bindActionCreators将动作绑定到道具simpleResult但是你直接使用该功能。我建议你应该像

一样提取它

componentWillMount() {
        this.props.simpleActions.getsimpleresult();
    }

还尝试将connect更改为

@connect(state => (state), dispatch => ({simpleActions: bindActionCreators(simpleActions, dispatch)}))

Answer 2

您的代码示例看起来不错。我想你的行动路径是错误的：

import * as simpleActions from '../actions/simple_reuslt'

请检查文件名 simple_reuslt 吗？在这里，我的意思是错误地写 reuslt 。

如何在组件中发布http请求并更新它？

2 个答案: