这个道具函数中的参数设置在哪里

Question

我正在检查这个实时演示，以在ReactJs上构建一个分页组件：https://codesandbox.io/s/l29rokm9rm?hidenavigation=1&view=预览&file=/src/App.js:2182-2216

我的问题是：在哪里以及如何设置此函数中的参数？：

onPageChanged={this.onPageChanged}

该函数获取"数据"：

onPageChanged = data => {

我不知道应用程序在哪里以及如何将"数据"传递给分页组件。

谢谢。

Answer 1

函数this.onPageChanged是作为对子组件的引用传递的，它是从那里调用的，它不是从这里调用的(应用程序组件本身(来向它传递参数！

如果您在提供的示例中检查Pagination组件，您将看到它是从组件的gotoPage方法调用的，如下第53行所示：

this.setState({ currentPage }, () => onPageChanged(paginationData));

你可以看到data的值来自这里的onPageChanged(paginationData)

基本上，在react中，您可以将任何值作为道具传递给子组件，只要函数被视为值(例如，您可以为变量分配函数(，就可以将其作为引用(视为回调(传递下去，以便从另一个地方调用！