我嘗試從本地資料庫中獲取一些影像 loc,而我嘗試將其顯示為文本,它作業得非常好,但是當我嘗試傳遞它時,它給了我一個錯誤
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>
這是我的產品資料
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"
不管我使用“'../assets/images/productimage/product1.jpg'”還是'../assets/images/productimage/product1.jpg',它仍然給我一個錯誤
它給出的錯誤是意外令牌“,”它需要將 data.productImage 更改為 data,productImage 顯然是錯誤的
uj5u.com熱心網友回復:
在這種情況下,您不能使用 require 函式來渲染影像,通常在 react-native expo 應用程式中,您已經在 app.json 檔案中寫下資產以將其與 require 函式一起使用。
在 app.json 檔案中包含您的資產,如下所示:
"assetBundlePatterns": [
"**/*",
"assests/*"
],
或者不使用資產,您可以{uri:"link"}在您的情況下使用方法。
<Image source={{uri: "link"}} />
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/486046.html
