从类外部调用方法 (React.js)

Question

这是我的例子： https: //codesandbox.io/s/test-uz-713xy 正如你在这个相当不错的例子中看到的，我尝试将 2 种不同的方法分配给 2 个不同的按钮（“skyfall”和“vileMurder”） .但是这些方法是从我的班级外部调用的，因此无法正确识别它们，我收到以下错误消息：skyFall is not defined 或vileMurder is not defined有人知道如何为我解决这个问题吗？

Answer 1

这些函数确实没有在您调用它们的范围内定义。这可以通过两个步骤解决：

1. 从 Profils 组件中将函数作为 props 传递

              <IsHeStillAlive

                skyFall={this.skyFall}

                vileMurder={this.vileMurder}

                panel={panel}

并更改映射函数以采用 lambda 而不是function因为函数将自己的 this 变量绑定到函数上下文。

this.state.data.map((panel) => {

2.使用道具IsHeStillAlive

 <Button onClick={() => props.vileMurder()}>

 ...

 <Button onClick={() => props.skyFall()}>

上面的更改足以识别和执行功能，但还有其他错误，也与this. 我建议您阅读有关this.

您可能也有兴趣将您的组件转换为反应挂钩。虽然这不是强制性的，但这是现在推荐的定义组件的方式，它可以防止大多数上下文绑定问题的发生。