I couldn't understand why...here is the GitHub repository: https://github.com/Dronrom/React-test
To solve the "Cannot read property 'value' of null" error, make sure you aren't accessing the value property on a null value, e.g. a non-existent DOM element. An element with the provided id does not exist in the DOM, so the getElementById method returns null .
The "cannot read property 'map' of null" error occurs when we call the map() method on a null value, most often when initializing a state variable to null . To solve the error, initialize the value you're mapping over to an empty array.
The "cannot read property 'map' of undefined" error occurs when we call the map() method on an undefined value, most often when the map method is called before the data from an API request has arrived. To solve the error, initialize the value you're mapping over to an empty array.
The "Cannot read property 'click' of null" error occurs when trying to call the click method on a null value. To solve the error, run the JS script after the DOM elements are available and make sure you only call the method on valid DOM elements.
That’s because you initialized peopleList as null in your component. So map works only on arrays so you need to check peopleList whether its really an array before doing map on it so
Change
renderItems(arr) {
return arr.map(({id, name}) => {
return (
<li className="list-group-item"
key={id}
onClick={() => this.props.onItemSelected(id)}>
{name}
</li>
);
});
}
To
renderItems(arr) {
if(arr){
return arr.map(({id, name}) => {
return (
<li className="list-group-item"
key={id}
onClick={() => this.props.onItemSelected(id)}>
{name}
</li>
);
});
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With