Property 'substring' does not exist on type 'HTMLCollectionOf<HTMLSpanElement>'

Joh 0
Viewed 18

I'm using React-admin, and my datas in list are too long. I would like to apply a limit of charater to display.

So my idea is to get all spans and then apply a substring.

Here is my code :

useEffect(() => {
        let spans = document.getElementsByTagName("span")

        if (spans.length > 50) {
            spans.substring(0, 50)} + "..."
        }
    }, [])

VSCode underline in red substring with error : Property 'substring' does not exist on type 'HTMLCollectionOf<HTMLSpanElement>'

Any idea how to achieve this ?

react-hooks reactjs
1 Answers

Try to change your code like this:

useEffect(() => {
    const spans = document.getElementsByTagName("span");
    // Transform spans into array
    const spansList = [...spans];
    for (const s of spansList) {
        if (s.textContent.length > 50) {
            s.textContent = s.textContent.substring(0, 50) + "..."
        }
    }
}, [])
lpizzinidev0
Related