Question

尝试获取数据并插入到 Flatlist ，有人能指出我的错误吗，几乎尝试了所有方法，尝试在 Official Docs 中制作，但没有帮助：

const [isLoading, setLoading] = useState(true);
  const [data, setData] = useState([]);
  
    useEffect(() => {
      fetch('https://app.sm117.ru/api/v1/contract/news/'),{
        method: "GET",
        headers: {"Content-type": "application/json; charset=UTF-8"}}

        .then((response) => response.json())
        .then((json) => setData(json. ???  ))//what can i put here , cause i my Json doesnt have title
        .catch((error) => console.error(error))
        .finally(() => setLoading(false));
      }, []);
  
    return (
      <View style={{ flex: 1, padding: 24 }}>
        {isLoading ? <ActivityIndicator/> : (
          <FlatList
            data={data}
            keyExtractor={({ id }, index) => id}
            renderItem={({ item }) => (
              <Text>{item.id}, {item.title}</Text>
            )}
          />
        )}
      </View>
    );
  };

Answer 1

在 fetch 调用中的 url 后面有一个右括号，它应该是这样的。

useEffect(() => {
      fetch('https://app.sm117.ru/api/v1/contract/news/',{
        method: "GET",
        headers: {"Content-type": "application/json; charset=UTF-8"}})

Answer 2

可能，你只是在这一行输入错误：

  fetch('https://app.sm117.ru/api/v1/contract/news/'),{
                                                     ^

您应该像这样使用 fetch()：

let promise = fetch(url, [options])

Answer 3

您无需传递任何内容，因为您的回复已包含所有列表。

.then((json) => setData(json))

如果您打印数据或回复，您会更好地了解。把 console ，事情会更清楚。

让我们考虑这个例子。如果你考虑这个请求。

https://reactnative.dev/movies.json

您必须在此处输入 json.movies 才能获取所有列表。

无法从 API 获取数据并插入到 FlatList

3 个答案: