Scrollspy throws a TypeError due to ref.current being null

  1. MDB Home Page
  2. Support Main Page
  3. MDB React
Topic: Scrollspy throws a TypeError due to ref.current being null

Stoofie asked 3 years ago

Expected behavior

Not throw a TypeError and be able to handle cases where current is still null.

Actual behavior

Throws a TypeError cannot read properties of null (reading 'offsetTop').

Resources (screenshots, code snippets etc.) enter image description here

Not sure if this is an issue on my side but we have dynamic scrollspy sections being rendered and thus I've created an array of refs to handle the targets & subsections.

Example code as follow:

enter image description here This is how I map the array of refs onto the scrollspy components: enter image description here

Debugging the component's render I can see the .current for the refs are null, however they are changed later on by the components containing the refs as follow: enter image description here Seeing as refs do not trigger a re-render, how can I get pass this issue?

Wojciech Staniszewski staff commented 3 years ago

You could try to store the reference to the element in the useState hook. It will trigger rerender.

Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Open

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB React
  • MDB Version: MDB5 4.0.0
  • Device: N/A
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: No
Tags
react mdbreact
Related topics
1
NPM install fails with SSL certificate problem: certificate has expired
1
BUG: pass dynamic data to MDBSelect component
1
Issues with plugins and MDB React 5
1
Component Not found
0
MDBReact giving invalid hook error
About author
Stoofie
10Support score
2Questions 0Answers
0Snippets likes 0Snippets