reactjs - როგორ განვახორციელოთ API ზარი redux-თან ერთად?


მიმინანლებამდე ვსწავლობ react-redux-ს. ახლა ცოტა შემექმნა პრობლემა, როგორ შემიძლია განვახორციელო api call.

აქ არის ჩემი action.ts

export const fetchEvent = () => async (
    dispatch: Dispatch
) => {
    dispatch({ type: ActionTypes.FETCH_EVENT_REQUEST });

    try {
        const response = await axios.get<EvenData[]>(
            `https://jsonplaceholder.typicode.com/todos/`
        );
        dispatch<FetchEventAction>({
            type: ActionTypes.FETCH_EVENT_SUCCESS,
            payload: response.data
        });

    } catch (error) {
        dispatch({ type: ActionTypes.FETCH_EVENT_FAILURE, error });
    }
};

და აი ჩემი ღონისძიებების სია, და მე მინდა აქ API მოთხოვნა გავაკეთო

const mapStateToProps = (state: ActionTypes) => ({});
const dispatchProps = {};

type Props = ReturnType<typeof mapStateToProps> & typeof dispatchProps;

type State = {};

class EventList extends React.Component<Props, State> {
    componentDidMount() {
        // dispatch(fetchEvent());
    }

    render() {
        return (
            <section>
                <p>{ }</p>
            </section>
        );

    }
}

export default connect(
    mapStateToProps,
    dispatchProps
)(EventList);

როგორ შემიძლია API მოწოდების გაკეთება? ჩემს componentDidMount-ში

პასუხი #1

თქვენ გამოტოვებთ mapDispatchToProps-ს, ის, რომლის გამოყენებაც გიწევთ, ცარიელია {}.

import {fetchEvent} from 'action.ts' // change to correct path

const mapStateToProps = (state: ActionTypes) => ({});
const mapDispatchToProps = (dispatch: Dispatch) => {
  return {
    fetchEvent: () => {
      dispatch(fetchEvent())
    }
  };
};

type Props = ReturnType<typeof mapStateToProps> & ReturnType<typeof mapDispatchToProps>;

type State = {};

class EventList extends React.Component<Props, State> {
    componentDidMount() {
        this.props.fetchEvent()
    }

    render() {
        return (
            <section>
                <p>{ }</p>
            </section>
        );

    }
}

export default connect(
    mapStateToProps,
    mapDispatchToProps
)(EventList);