Javascript 在平面列表中反应本机动态图像

初学者的问题在这里，所以要轻松。 我一直在尝试在我的平面列表中使用URL呈现一些图像：我首先尝试在文本中使用标题，它似乎起到了作用。 但当我尝试使用URL时，它不起作用，我的代码：

export default function Home() {
     const [data, setData] = useState([]);
      useEffect(() => {
        fetch('https://jsonplaceholder.typicode.com/photos')
          .then((res) => res.json())
          .then((response) => setData(response))
          .catch((error) => {
               console.log(error);
             });
      });
     return (
        <View style={styles.containermainstyle}>
          <View style={styles.headerstyle}>
            <TextInput style={styles.inputstyle} placeholder={'product...'} />
            <TouchableOpacity>
              <Text>Filtres</Text>
            </TouchableOpacity>
          </View>
          <View style={styles.mainstyle}>
            <FlatList
              data={data}
              renderItem={({ item }) => {
              <View style={{flex:1, flexDirection: 'row'}}>  
                <Image
                  style={styles.imagestyle}
                  source={{uri: item.url }}
                />;
              </View>
              }}
            />
          </View>
        </View>
      );
    }

导出默认函数Home（）{
const[data，setData]=useState（[]）；
useffect（（）=>{
取（'https://jsonplaceholder.typicode.com/photos')
.然后（（res）=>res.json（））
.然后（（响应）=>setData（响应））
.catch（（错误）=>{
console.log（错误）；
});
});
返回(
过滤
{
;
}}
/>
);
}

您的renderItem函数似乎不正确，因为它缺少一个

return（）

而不是

({ item }) => {
<View style={{ flex:1, flexDirection: 'row' }}>  
  <Image
    style={styles.imagestyle}
    source={{ uri: item.url }}
  />;
</View>
}

---

下面的答案应该是可以的-请投票并接受感谢

({ item }) => {
  return (
  <View style={{ flex:1, flexDirection: 'row' }}>  
    <Image
      style={styles.imagestyle}
      source={{ uri: item.url }}
    />
  </View>
  )
}

import React, { useState, useEffect } from "react"
import { View, Image, FlatList, Text, TouchableOpacity } from "react-native"

export default function App() {
  const [data, setData] = useState([])
  useEffect(() => {
    fetch("https://jsonplaceholder.typicode.com/photos")
      .then((res) => res.json())
      .then((response) => {
        setData(response)
      })
      .catch((error) => {
        console.log(error)
      })
  }, [])

  const renderItem = ({ item }) => {
    console.log(item)
    return (
      <View style={{ flex: 1, flexDirection: "row" }}>
        <Image style={{ height: 100, width: 100 }} source={{ uri: item.url }} />
      </View>
    )
  }

  return (
    <View>
      <View>
        <FlatList data={data} renderItem={renderItem} />
      </View>
    </View>
  )
}