React native fetch image location data from local database error unexpected token ","

I try to fetch some image loc from my local database, while I try to show it as a text it works perfectly fine but when I try to pass it on it gives me an error

const Products = () => {

const ProductCard = ({data}) => {
        <TouchableOpacity>
            <View>
             <Image source={require({data.productImage})} />
            </View>
        </TouchableOpacity>
}

return (
<View>
<View style={{
    width: '100%',
    flexDirection: 'row',
    justifyContent: 'space-between',
}}>
  <Text>Filter by</Text>
  <Text>Sort by</Text>
</View>
<View style={{width: '100%',}}>
      {productData.map(item => {
          return <ProductCard data={item} key={item.productSKU} />
      })}
  </View>
</View>

and here is my product data

export const productData = [{
"productSKU": 1,
"productSize": "M",
"productColor": "pink",
"productImage": "'../assets/images/productimage/product1.jpg'",
"productDesc": "It's a nice blue dress.",
"productPrice": 150,
"productName": "LIANA"

it doesn’t matter if I use "’../assets/images/productimage/product1.jpg’" or ‘../assets/images/productimage/product1.jpg’ it still gives me an error

The error it give is unexpected token "," which it needs to change data.productImage to data,productImage which it obviously wrong

>Solution :

You can’t use require function to render image in this situation, normally in react-native expo app you have write down assets in app.json file to use it with require function.

Include your assest in app.json file like this:

    "assetBundlePatterns": [
      "**/*",
      "assests/*"
    ],

Or without using assets you can use {uri:"link"} method in your situation.

<Image source={{uri: "link"}} />