React Native拼接BaseURL从API加载图片无法显示，求解决

1. 修复Image组件source格式错误 #

React Native加载网络图片时，source必须传入{ uri: 完整图片URL }格式的对象，你直接传拼接后的字符串不符合要求，修改代码如下：

const baseURL = 'https://lsm-static-prod.livescore.com/medium/'

<Image 
  source={{ uri: baseURL + item.Events[0].T1[0].Img }}
  resizeMethod="contain"
  style={{ width: 30, height: 30 }}
/>

2. 验证拼接后的URL有效性 #

• 打印baseURL + item.Events[0].T1[0].Img的完整字符串，复制到浏览器地址栏，确认图片是否能正常加载。
• 检查是否存在重复斜杠：如果item.Events[0].T1[0].Img开头已经带有/，拼接后会出现https://lsm-static-prod.livescore.com/medium//xxx.png的无效路径，此时需去掉baseURL末尾的斜杠，或者处理Img字段的开头斜杠。

3. 确保数据存在且合法 #

添加可选链判断，避免因数据未加载或字段缺失导致错误：

{item?.Events?.[0]?.T1?.[0]?.Img && (
  <Image 
    source={{ uri: baseURL + item.Events[0].T1[0].Img }}
    resizeMethod="contain"
    style={{ width: 30, height: 30 }}
  />
)}

4. 检查Android网络权限 #

如果是Android设备，确认AndroidManifest.xml中已添加网络权限：

<uses-permission android:name="android.permission.INTERNET" />

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