ReactNative :Local images do not work with FlatList in React Native?

Question

I'm trying to build React-Native app and I have 4 images inside the project and I'm trying to display them through Flatlist. I put the image link into an array. I try to retrieve the images through the Render item, but it shows me this error What am I doing wrong? What is the solution?

my array

const categoryData = [
    {
      title: 'middle east food',
      image: '../assets/image/category1.png',
      ALIAS: 'mediterranean, All',
    },
    {
      title: 'mexican food',
      image: '../assets/image/category2.jpg',
      ALIAS: 'easternmexican',
    },
    {
      title: 'Spanish Food',
      image: '../assets/image/category3.png',
      ALIAS: 'spanish, All',
    },
    {
      title: 'Turkish Food',
      image: '../assets/image/category4.jpg',
      ALIAS: 'turkish, All',
    },
  ];

flatListCode

<FlatList
            horizontal
            data={categoryData}
            renderItem={({item}) => (
              <Pressable>
                <Image source={require(item.image)}/>
                <Text>{item.title}</Text>
              </Pressable>
            )}
          />

error enter image description here

Answer 1

my solution:

  const categoryData = [
    {
      title: 'middle east food',
      image: require('../assets/image/category1.png'),
      ALIAS: 'mediterranean, All',
    },
    {
      title: 'mexican food',
      image: require('../assets/image/category2.jpg'),
      ALIAS: 'easternmexican',
    },
    {
      title: 'Spanish Food',
      image: require('../assets/image/category3.png'),
      ALIAS: 'spanish, All',
    },
    {
      title: 'Turkish Food',
      image: require('../assets/image/category4.jpg'),
      ALIAS: 'turkish, All',
    },
  ]; 




 <FlatList
                horizontal
                data={categoryData}
                renderItem={({item}) => (
                  <Pressable>
                    <Image
                      showsHorizontalScrollIndicator
                      resizeMode="stretch"
                      style={[
                        styles.categoryImg,
                        {width: width / 2.25, height: width / 2.25},
                      ]}
                      source={item.image}
                    />