Javascript 如何在组件激发的函数中使用ToAction？

由于onClick事件中触发的操作，我不断收到错误“无法读取未定义的属性'props'。我希望使用存储中的一段状态触发该操作，以使用它发出AJAX请求

import React, { Component } from "react";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { fetchInfo } from "../actions";

// Here we take in the passed in props from the FoodList component and render
// the dishes for the inputted ingredients

class Recipe extends Component {

  renderFood(food) {
    return (
      <div className="food-container">
        {food.map(function(recipe) {
          return (
            <div
              className="indiv-recipe"
              style={{
                backgroundImage: "url(" + recipe.image + ")"
              }}
              onClick={() => this.props.fetchInfo(recipe.id)}
            >
              <div id="recipe-title"> {recipe.title}</div>
            </div>
          );
        })}
      </div>
    );
  }

  render() {
    return (
      <div>
        <h1>{this.props.foods.map(this.renderFood)}</h1>
      </div>
    );
  }
}

function mapDispatchToProps(dispatch) {
  return bindActionCreators({ fetchInfo }, dispatch);
}

export default connect(
  null,
  mapDispatchToProps
)(Recipe);

import React，{Component}来自“React”；
从“react redux”导入{connect}；
从“redux”导入{bindActionCreators}；
从“./actions”导入{fetchInfo}；
//在这里，我们从FoodList组件中获取传入的道具并进行渲染
//这道菜是用来装配料的
类配方扩展组件{
伦德食品（食品）{
返回(
{food.map（函数（配方）{
返回(
this.props.fetchInfo（recipe.id）}
>
{recipe.title}
);
})}
);
}
render（）{
返回(
{this.props.foods.map（this.renderFood）}
);
}
}
功能图DispatchToprops（调度）{
返回bindActionCreators（{fetchInfo}，dispatch）；
}
导出默认连接(
无效的
mapDispatchToProps
)（配方）；

您只是在两个map中都缺少此项，或者将两者都更改为箭头函数，或者在调用map时将其作为第二个参数传递。

这是一个猜测，但是您是否尝试了箭头符号而不是

函数

？我不确定默认情况下，

函数

是否绑定到

此

。如果你不能使用箭头，你可以在中插入

这个

。你说的咖喱是什么意思？如果将

函数（配方）{…}

更改为

（配方）=>{…}

不起作用，问题可能不是绑定

此

；还可能是什么？嗯。我说的咖喱是指：把

函数（配方）{…}

改成

函数（这个）{返回函数（配方）{…}}（这个）

并使用

this.props.fetchInfo

而不是

this.props.fetchInfo

。我认为您应该在

fetchInfo

之前省略

this.props.props

因为这与道具无关-您正在从Action导入它，结果是，{this.props.foods.map（this.renderFood）}需要切换到{this.props.foods.map（this.renderFood，this）}。无论如何，谢谢！