React Native插入Image组件报错：View config not found for name ""

嘿，这个坑我踩过！你看你代码里的解构语句：

const { Id, Image, Name } = category.item 

这里你把category.item里的Image字段取出来了，但React Native的图片组件也叫<Image />啊！这就导致你后面写<Image />的时候，React误以为你要渲染的是这个从category里拿到的普通数据字段，而不是原生的Image组件，自然就找不到对应的View配置，报错了。

修复方法超简单，二选一就行： #

• 重命名字段：把解构出来的Image改成别的名字，避免和组件名冲突，比如itemImage：

  const { Id, Image: itemImage, Name } = category.item 
  

  这样后面的<Image />就会正确指向React Native的组件了。
• 直接删掉无用字段：看你代码里根本没用到这个category.item.Image字段（Image组件用的是网络图片），那直接从解构里去掉Image就行：

  const { Id, Name } = category.item 
  

另外别忘了确认你已经正确导入了Image组件：

import { View, TouchableOpacity, Image, Text } from 'react-native';

修复后的完整函数大概是这样：

renderCategory = (category)=>{ 
  const { Id, Image: itemImage, Name } = category.item 
  const { button, image_category, text_category} = style;
  return( 
    <TouchableOpacity style={button} onPress={()=>{console.log(Id)}}> 
      <View style={{flex:1}}> 
        <Image style={image_category} source={{uri:'https://picsum.photos/150/150'}} /> 
        <Text>{Name}</Text> 
      </View> 
    </TouchableOpacity> 
  ) 
}

本质就是变量名和内置组件名重名导致的识别错误，改个名字就搞定啦！

内容的提问来源于stack exchange，提问作者Manspof