React Native Apollo + Django：网络请求失败

Question

我对编程非常陌生，无法理解我的 react native expo 应用程序如何没有从我的 Django 服务器（正在运行）获取数据。我该如何解决这个问题？

我让 graphene-django 在后面运行。

这是我的 App.js

网络错误：网络请求失败

PS。我肯定需要更多的练习。感谢您的帮助。

import React, { Component } from 'react'
import { StyleSheet, Text, View } from 'react-native'
import { ApolloClient, HttpLink, InMemoryCache } from 'apollo-boost'
import { ApolloProvider, gql, useQuery } from '@apollo/client'


const client = new ApolloClient({
  link: new HttpLink({
    uri: 'http://(local-ip-address):8000/graphql'
  }),
  cache: new InMemoryCache(),
})

const todoQuery = gql`
  query fetchTodo {
    todos {
      rank
      title
      content
    }
  }
`;

const TodoComponent = () => {
  const { loading, error, data } = useQuery(todoQuery);

  if (loading) return "Loading...";
  if (error) return `Error! ${error.message}`;

  return (
    <ul>
      {data.todos.title.map((title) => (
              <li>{title}</li>
        ))}
    </ul>   
  );
};


export default class App extends Component {
  render() {
    return (
      <ApolloProvider client={client}>
        <View style={styles.container}>
          <Text style={styles.welcome}>Welcome to React Native!</Text>
          <Text>
            <TodoComponent style={styles.welcome}/>
          </Text>
        </View>
      </ApolloProvider>
    )
  }
}


const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
})

Answer 1

当您运行您的 react 应用程序时，您的 django 服务器正在运行。有时因为这个错误来了。