Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot read property 'getElementsByTagName' of undefined #31

Open
GeorgeCodeHub opened this issue May 18, 2020 · 4 comments
Open

Cannot read property 'getElementsByTagName' of undefined #31

GeorgeCodeHub opened this issue May 18, 2020 · 4 comments

Comments

@GeorgeCodeHub
Copy link

Hello there.

I'm unable to start a project with your library. Here is an example below:

https://stackblitz.com/edit/antd-infinity

I also tried making it in CodeSandbox and codePen and got the same issue.

Am I forgetting to add something?

@kumawatanupriya
Copy link

I am also getting the same issue. @GeorgeCodeHub did you find any solution?

@GeorgeCodeHub
Copy link
Author

Sadly no. Something must be conflicting with either the antD or React lib...

@marcellp
Copy link

marcellp commented May 28, 2020

If you're still looking for a solution, the problem is that the code does not like an empty array for data. Having at least one row in the table by default is needed, otherwise the thing craps out.

@RalfZhang
Copy link

I found that the reason might be antd's version is too high.
When I used antd v3.26.15, the component would run correctly.

I used antd v4.8.2. And I traced the error. It's cause of these codes

componentDidMount() {
    /* eslint-disable */
    this.refScroll = ReactDOM.findDOMNode(this).getElementsByClassName(
      'ant-table-body',
    )[0];
    this.refTable = this.refScroll.getElementsByTagName('tbody')[0];
    ...
}

I found ReactDOM.findDOMNode(this) is

<div class="ant-table-wrapper table">
  <div class="ant-spin-nested-loading">
    <div class="ant-table">
      <div class="ant-table-container">
        <div class="ant-table-content">
          <table>
            <colgroup>...</colgroup>
            <thead class="ant-table-thead">...</thead>
            <tbody class="ant-table-tbody">...</tbody>
          </table>
        </div> 
      </div>
    </div>
  </div>
</div>

It's obvious that this.refScroll would be undefinde.

If u change the code to

componentDidMount() {
    /* eslint-disable */
    this.refScroll = ReactDOM.findDOMNode(this).getElementsByClassName(
      'ant-table', // changed here
    )[0];
    this.refTable = this.refScroll.getElementsByTagName('tbody')[0];
    ...
}

The component would run correctly.

The last commit was pushed one year ago. So I think we should not use the package any more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants