如何在父类组件中使用正确的上下文(this)异步调用函数?

Question

我需要在子类中的一些异步操作后调用父类中的函数。我就会得到一个错误基本上是说&;this&;是未定义的。

像这样:

class Parent extends React.Component {
......
openFile (path) {
...
if (someCondition) this.showMessage();
}
......
......
render() {
<Child openFile={this.openFile}/>
}
}
function Child ({ openFile }) {
......
const createNewFile = () => {
// using electron but doubt it matters
dialog.showOpenDialog(
// choose file location
).then(({path}) => {
openFile(path)
})
}
}

错误是无法读取未定义的属性'showMessage'。在这种情况下，是否存在传递上下文的正确方法?

Answer 1

正如评论中所指出的，我需要在父类组件中添加.bind(this)。