如何将功能子组件的值传递给 class 父组件并将值保存到状态？

Question

我有一个父 class 组件，它有一个功能性子 table 组件。当用户在 table 组件中选择一行时，我试图捕获行数据（数据是一个对象）， return 它到父组件，然后将其保存到状态。我目前运行遇到以下错误：Uncaught TypeError: Cannot read property 'setState' of undefined

我引用了这个堆栈问题，但这并没有将子组件的值保存到父组件中的状态：

问题：如何将值保存到状态？

父class组件

class ParentComponent extends Component {
    constructor(props) {
        super(props);
        this.state = {
            selectedRows: []
        };
    }

    setSelectedDataTableRow(selectedRow) {
        console.log('setSelectedDataTableRow triggered!', selectedRow);
        this.setState({selectedRows: selectedRow}) //this is causing the error
    }

    render() {
        return (
            <>
                <ChildComponent 
                     otherProps={otherProps} 
                     setSelectedDataTableRow={this.setSelectedDataTableRow} 
                />
            </>
        );
    }
}

子功能组件

const ChildComponent = ({ otherProps, setSelectedDataTableRow }) => {
    const ROWS_PER_PAGE = 5;
    const captureRowData = (data) => {
        setSelectedDataTableRow(data)
    }

    return (
        <div>
            <DataGrid
                //other attributes
                onRowSelected={(e) => captureRowData(e.data)}
            />
        </div>
    );
};

Answer 1

Dave 在评论中提供的解决方案达到了目的。将其作为答案张贴在这里：

setSelectedDataTableRow={this.setSelectedDataTableRow}

更新为

setSelectedDataTableRow={this.setSelectedDataTableRow.bind(this)}

如何将功能子组件的值传递给 class 父组件并将值保存到状态？

How to pass value from functional child component to class parent component and save value to state?

javascript

setstate

reactjs