Я получаю TypeError: this.props.function не является функцией при получении из API - PullRequest
Новая
       4

Я получаю TypeError: this.props.function не является функцией при получении из API

0 голосов
/ 16 января 2020

Я пытаюсь получить данные из API, но получаю ошибку: TypeError: this.props.getPeople не является функцией, хотя все выглядит хорошо через код, как показано ниже:

человек-компонент. js

import React, { Component } from 'react';
import './people-component-styles.css';
import { Container, Row, Col, Card } from 'react-bootstrap';
import { connect } from 'react-redux';
import { getPeople } from '../../actions/index'
import 'react-lazy-load-image-component/src/effects/blur.css';
import 'animate.css/animate.min.css';

export class People extends Component {

    componentDidMount() {
        // console.log(this.props);
        this.props.getPeople();
    }

    render() {
        // console.log(this.props);
        return (
            <Row className='main'>
                hello!  
            </Row>
        );
    }
}

const mapStateToProps = state => ({
    people: state.people
})

const mapDispatchToProps = dispatch => ({
    getPeople: () => dispatch(getPeople())
})

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

действия / индекс. js

export const getPeople = () => {
    console.log("yes");
    return async dispatch => {
        const response = await fetch('https://dma.com.eg/api.php?action=getPeople', {
            method: 'GET'
        })
        const json = await response.json();
        dispatch({ type: "GET_PEOPLE", payload: json });
    }
}

редукторы / индекс. js

const INITIAL_STATE = {
    people: []
}

const rootReducer = (state = INITIAL_STATE, action) => {

    switch (action.type) {
        case "GET_PEOPLE":
            return ({
                ...state,
                people: state.people.concat(action.payload)
            })
        default:
            return state;
    }
};

export default rootReducer

1 Ответ

0 голосов
/ 16 января 2020

Я импортировал People компонент в качестве имени, пока он экспортировался по умолчанию, благодаря @Brian Thompson .. это исправлено.

...