CODEWITHSUNDEEP
javascriptreactjs
Diagathe Josué
Diagathe Josué

Reputation: 11976

Why I can t get my this.refs.children elements?

I m trying to get the element of a ref in React, but my console.log returns undefined.

here a visual_log of the situation:

here we can see the HTML collection have well some element,but when call then, there is a problem: the console returns undefined

In this image we can see that in a first time, the HTML collection have well some element, but when I m trying to call the arrayElement then, there is a problem: the console returns undefined

Here my code: 

let sliderContainer= this.refs.sliderContainer
console.log("sliderContainer: ", sliderContainer) // return reference element with all property inside
console.log("sliderContainer.childNodes: ", sliderContainer.childNodes,sliderContainer.children ) // return NodeList, HTMLCollection.... length 4
console.log("sliderContainer.childNodes[0]: ", sliderContainer.childNodes[0], sliderContainer.children[0) // return undefined, undefined

How it is possible since my console display me in the first log all the div elements inside my refereed component?

Any hint would be great, thanks

Upvotes: 1

Views: 215

Answers (1)

Pavel Shirobok
Pavel Shirobok

Reputation: 307

It's HTMLCollection, it works like an array, so you can access to elements by index collection[index]. For more information you can see this page

Upvotes: 2

Related Questions