TypeError: undefined is not an object (evaluating 'item.id.toString')

مرحبا .. يظهر لى هذا الخطا لان ال array فى البداية تكون فارغة لاننى مستخدم useStete
 أنا اريد ان اقوم بحل هذه المشكلة ..    

TypeError: undefined is not an object (evaluating 'item.id.toString')

هذا هو الكود 

import React, {useState} from 'react';
import {View, Button, FlatList, Text} from 'react-native';
import AsyncStorage from '@react-native-async-storage/async-storage';

const books = [
  {id: 1, name: 'الاسود يليق بك'},
  {id: 2, name: 'هيبتا'},
  {id: 3, name: 'أرض زيكولا'},
];

export default function GetDataScreen() {
  const [Books, setBooks] = useState([]);
  console.log(Books.length);

  const storeData = async value => {
    try {
      const books = JSON.stringify(value);
      await AsyncStorage.setItem('books', books);
      console.log(books);
    } catch (e) {
      console.log(e);
    }
  };

  const getData = async () => {
    try {
      const jsonValue = await AsyncStorage.getItem('books');
      setBooks(jsonValue);
      return jsonValue != null ? JSON.parse(jsonValue) : null;
    } catch (e) {
      console.log(e);
    }
  };

  React.useEffect(() => {
    getData();
  }, []);

  if (Books.length === 0) {
    return <Text>Wait ...</Text>;
  }

  return (
    <View>
      <Button title="Save" onPress={() => storeData(books)} />
      <Button title="get" onPress={() => getData('books')} />

      <FlatList
        data={Books}
        keyExtractor={item => item.id.toString()}
        renderItem={({item}) => <Text>{item.id}</Text>}
      />
    </View>
  );
}