9、React中使用GraphQL和Apollo Client进行数据交互

React中使用GraphQL和Apollo Client进行数据交互

1. GraphQL查询的实现

在React中，我们可以使用Apollo Client来实现GraphQL查询。首先，我们从一个简单的示例开始，创建一个 Profile 组件来渲染当前用户及其关联的仓库信息。

1.1 引入 Profile 组件

在 src/App/index.js 文件中，引入并使用 Profile 组件：

import React, { Component } from 'react';
import Profile from '../Profile';

class App extends Component {
  render() {
    return <Profile />;
  }
}

export default App;

1.2 创建 Profile 组件

在 src/Profile/index.js 文件中，创建一个简单的无状态函数组件：

import React from 'react';

const Profile = () =>
  <div>Profile</div>

export default