this.props не является функцией редукса от родительского к дочернему компоненту

Question

Привет! У меня возникла проблема с вызовом действия в дочернем компоненте.

Однако я могу запустить компонент CompanyForm сам по себе, и он будет работать, но при обработке как дочерний компонент я сталкиваюсь сошибка:

Uncaught TypeError: this.props.createCompany не является функцией

Companies.js

render() {
    return (
        <div>
            <CompanyForm/>
        </div>
    );
}

CompanyForm.js

import { createCompany } from "../../actions/companyAction";
export class CompanyForm extends Component {
constructor(props) {
    super(props);

    this.state = {
        companyName: '',
        street1: '',
        street2: '',
        city: '',
        state: '',
        zipcode: ''
    };

    this.handleSubmit = this.handleSubmit.bind(this);
}


handleSubmit(event) {
    event.preventDefault();
    const company = {
        ...
    };
    console.log(company);
    this.props.createCompany(company)

}
}
export default connect(null, { createCompany })(CompanyForm);

companyActions.js

export const createCompany = (companyData) => dispatch => {
console.log('CREATE_COMPANY: ', companyData);
fetch('api/Company/Create', {
    ...
)};

Answer 1

Вы экспортируете как компонент, так и подключенный компонент. Вы должны убедиться, что импортируете нужный компонент.В данном случае правильным является подключенный компонент.

Answer 2

импорт дочерних компонентов без фигурных скобок в родительский компонент, т. Е.

import CompanyForm from '../component/companyForm/CompanyForm';

NOT

import { CompanyForm } from '../component/companyForm/CompanyForm';