反应:TypeError:调度不是函数

时间:2020-05-29 07:38:19

标签: javascript reactjs redux react-redux redux-thunk

我想从redux获取。我正在学习本教程:https://codesandbox.io/s/react-redux-application-hewdb?file=/src/pages/PostsPage.js

但是当我在代码中使用它时:

import React, { useState, useEffect } from 'react';
import { connect } from 'react-redux';
import {fetchInterview} from '../actions/interviewActions'

const DetailInterview = (props, { dispatch, loading, interviews, hasErrors }) => {

  console.log("test interview",interviews)
  useEffect(() => {
    const { match: { params: { id } } } = props;
    dispatch(fetchInterview(id))
  }, [dispatch])

  const interviewslist = interviews

  console.log('interview: ', interviews)

  return (
    <div>
      <h3>All participants</h3>
      <table>
        <thead>
          <tr>
            <th>ID</th>
            <th>Interview id</th>
            <th>Partcipants id</th>
            <th>Time</th>
          </tr>
        </thead>
        <tbody>
          {
            console.log('interviews:sad ', interviews)
          }
          {
            interviews? interviews.map((interview) => {
              console.log('sadassad',interview)
              console.log('sadaghahhgsghssad',interviews)
              return (
                <tr key={interview.id}>
                  <td>{interview.id}</td>
                  <td>{interview.interview_id}</td>
                  <td>
                    {/* <Link to={`/posts/${post.id}`}> */}
                    {interview.participant_id}
                    {/* </Link> */}
                  </td>
                  <td>{interview.created_at}</td>
                </tr>
              ) 
            }) : null
          }
        </tbody>
      </table>
    </div>
  );
}

// export default DetailInterview;

const mapStateToProps = state => ({
  loading: state.interview.loading,
  interviews: state.interview.interview,
  hasErrors: state.interview.hasErrors,
})
export default connect(mapStateToProps)(DetailInterview)

我收到一个错误:未捕获的TypeError:调度不是函数

无法理解其背后的错误是什么。

1 个答案:

答案 0 :(得分:1)

您正在从DetailInterview的第二个参数解构值,而应该从props进行解析,因为mapStateToProps的值和connect可以作为props应用于连接的组件

const DetailInterview = (props) => {
    const { dispatch, loading, interviews, hasErrors } = props;
    ...
}