您需要将 e 放入您的函数中

在您的 onClickHandler 中，在参数中添加 e。

onClickHandler = (e) => {
   const song = e.target.getAttribute('data-item');
   console.log('We need to get the details for ', song);
    
}

我希望它能解决您的问题

您没有将 onClickHandler 参数作为 e 传递， 请参阅以下代码。

import React from 'react';
import './gridStyle.css';

class Grid extends React.Component {

    onClickHandler = (e) => {
        const song = e.target.getAttribute('data-item');
        console.log('We need to get the details for ', song);
    }

    renderResultRows(data) {
        return data.map((coord, index) =>
            // anon func maintains scope!
            // Pass in a function to our onClick, and make it anon
            // to maintain scope.  The function body can be anything
            // which will be executed on click only.  Our song value
            // is maintained via a closure so it works.
            (
                // eslint-disable-next-line react/no-array-index-key
                <tr key={index} data-item={coord} onClick={this.onClickHandler}>
                    <td data-title="cc">{coord.lat},{coord.lon}</td>
                    <td data-title="ic" />
                    <td data-title="dlat" />
                    <td data-title="dlon" />
                </tr>
            )); // no need to bind with anon function
    }

    render() {
        console.log('Coords passed in from Accuracy Calculator :', this.props.coords);
       return (
            <div className="grid">
                <table id="table0">
                    {this.renderResultRows(this.props.coords)}
                </table>
            </div>
        );
    }
}

export default Grid;

您需要更改...

  onClickHandler = () => {
    const song = e.target.getAttribute('data-item');
    console.log('We need to get the details for ', song);
}

至

onClickHandler = (e) => {
    const song = e.target.getAttribute('data-item');
    console.log('We need to get the details for ', song);
}

以避免出现您遇到的错误。您可以在 此处 阅读有关事件对象的更多信息。