CODEWITHSUNDEEP
javascriptreactjs
klixo
klixo

Reputation: 452

Cannot read property 'length' of undefined react

TypeError: Cannot read property 'length' of undefined

That's what the compiler says when I run my react app. What I do need to do with this?

request = (start,end) => {
   if(this.state.teams.length < 1){
       axios.get(`${ URL }/teams`)
       .then( response => {
           this.setState({
               teams:response.data
           })
       })
   }

    axios.get(`${ URL }/articles?_start=${start}&_end=${end}`)
    .then( response => {
        this.setState({
            items:[...this.state.items,...response.data]
        })
    })
}

Upvotes: 5

Views: 40845

Answers (5)

Chika Nwazuo Evuka
Chika Nwazuo Evuka

Reputation: 41

This issue happens especially in react or react native, just add a question sign e.g,

{title?.length>20? title?.substring(0,20)+'...':title}

Upvotes: 0

NearHuscarl
NearHuscarl

Reputation: 81370

Probably because you're having a variable that is supposed to contain an array but is undefined when referencing the length property. Try searching for .length in your editor and create an empty array if it's not initialized:

if ((arr || []).length > 0) {
  // do something
}

// or

if (arr?.length > 0) {
  // do something
}

Upvotes: 0

Hasan Zahran
Hasan Zahran

Reputation: 1442

I would suggest to check first if the props is undefined or empty or even declared.

for example:- 

    const card = props && props.cards && props.cards.length > 0 ?
        props.cards.map((card, i) => {
            return (
                <card >
            )
        }) : '';

And return your card.

Upvotes: 7

thomas.winckell
thomas.winckell

Reputation: 1277

Be sure that the teams value of your component's state is initialized with an array value like this :

class MyComponent extends React.Component {

    state: {
      teams: [],
    };
}

Upvotes: 3

Bekah Saugen
Bekah Saugen

Reputation: 81

I would suggest using a check to see if "teams" is undefined before trying to get the length.

if (value === undefined) {
    // value is undefined
}

Upvotes: 4

Related Questions