TypeError: undefined is not an object (evaluating 'items.map')

Question

After receiving items, the following error occurs. At the moment I'm just learning and have looked at other answers on this topic, nothing comes up.

export default function App() {
  const [items, setItems] = React.useState();

  React.useEffect(() => {
    axios
      .get('https://62fa26ddffd7197707e66da8.mockapi.io/items')
      .then(({ data }) => {
        setItems(data);
      })
      .catch((err) => {
        console.log(err);
        Alert.alert('Ошибка', 'Ошибка при получении статей');
      });
  }, []);

  return (
    <View>
      <StatusBar style="inverted" />
      {items.map((obj) => (
        <Post title={obj.title} price={obj.price} imageUrl={obj.imageUrl} />
      ))}
    </View>
  );
}

Error:

 ERROR  TypeError: undefined is not an object (evaluating 'items.map')

This error is located at:
    in App (created by ExpoRoot)
    in ExpoRoot
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent)

have you tried logging out what items is? – Jorge Guerreiro Aug 26 '22 at 08:38 — Jorge Guerreiro, Aug 26 '22 at 08:38

score 1 · Accepted Answer · answered Aug 26 '22 at 08:38

1

items default value is not an array, you just need to set blank array as default.

const [items, setItems] = React.useState([]);

answered Aug 26 '22 at 08:38

Ravi

34,851
21
122
183

1

Thanks a lot! I put ' ', I thought that an empty value is required, but here is an array! Thank you! – CRAYS CRAYSOVICH Aug 26 '22 at 08:39

score 0 · Answer 2 · answered Aug 26 '22 at 08:40

0

Don't forget that first render will be with your default state in useState. So you need write a condition or pass valid default value in useState like empty array

answered Aug 26 '22 at 08:40

Rusty Nail

120
1
7

Yes, you're right, I'll take that into account, thanks! – CRAYS CRAYSOVICH Aug 26 '22 at 08:41

TypeError: undefined is not an object (evaluating 'items.map')

2 Answers2