Question

我正在重新回答上一个问题。我正在一个项目中，该项目显示了github api中的存储库列表。

它工作正常，我从api中获得了所有回购信息，但是当我从特定存储库中单击一个按钮时，我需要它以我制作的模式显示来自https://api.github.com/repos/:USER:/:REPONAME:/pulls的拉取请求信息。

但是我不知道该怎么做。有人可以帮我吗？

import React, { Component } from "react";
import axios from "axios";
import Navbar from "./components/Navbar";
import Modal from "react-modal";

class App extends Component {
  constructor() {
    super();
    this.state = {
      githubData: [],
      isActive: false
    };
  }
  componentDidMount() {
    axios
      .get(
        "https://api.github.com/search/repositories?q=language:Java&sort=stars&page=1"
      )
      .then((res) => {
        console.log("res", res);
        this.setState({ githubData: res.data.items });
      });

    Modal.setAppElement("body");
  }

  toggleModal = () => {
    this.setState({
      isActive: !this.state.isActive
    });
  };

  render() {
    const { githubData } = this.state;
    return (
      <div className="container">
        <Navbar />
        <div className="row">
          {githubData.map((name, index) => (
            <div className="col-md-12" key={name.id}>
              <img src={name.owner.avatar_url} alt="Imagem do projeto" />
              <h1>
                Projeto:&nbsp;
                {name.name}
              </h1>
              <h1>
                Autor:&nbsp;
                {name.owner.login}
              </h1>
              <h1>
                Descrição:&nbsp;
                {name.description}
              </h1>
              <h1>
                Link:&nbsp;
                <a href={name.homepage}>{name.homepage}</a>
              </h1>
              <h1>
                Stars:&nbsp;
                {name.stargazers_count}
              </h1>
              <button onClick={this.toggleModal}>
                Open pull request for this repository
              </button>
              <Modal
                isOpen={this.state.isActive}
                onRequestClose={this.toggleModal}
              >
                <p onClick={this.toggleModal}>
                  PULL REQUEST LIST FROM THIS REPOSITORY
                </p>
              </Modal>
            </div>
          ))}
        </div>
      </div>
    );
  }
}

export default App;

模式正在运行，我只需要从api获取请求请求信息，但不知道如何从特定存储库获取信息。

Answer 1

一段时间后，我开始工作。

我刚刚创建了一个新组件，使用axios调用github api并作为道具传递用户和仓库。

此处提供代码：

import React from "react";
import axios from "axios";

const PullRequest = (props) => {
  axios
    .get(
      "https://api.github.com/repos/" + props.user + "/" + props.repo + "/pulls"
    )
    .then((repo) => {
      console.log("repo", repo);
    });
  return (
    <div>
      <p>Nome do repositório: {props.repo}</p>
      <p>Nome do usuário: {props.user}</p>
    </div>
  );
};

export default PullRequest;

干杯：）

Answer 2

签出我的GitHub开源项目，我将使用Node.js REST服务器执行该任务以及更多操作：

https://github.com/ConfusedDeer/Git-Captain

这是一个如何使用Node.js的示例（有关完整示例，请参见GitHub Project）：

else if ((appName === 'gitCaptain') && (webServ === 'searchForPR')) //create Branches
    {
        var urlForPRsearch = gitHubAPIendpoint + "/repos/" + orgName + "/" + req.body.repo + "/pulls?" + "state=" + req.body.state + "&base=" + req.body.prBaseBranch + "&" + req.body.token;

        // noinspection JSDuplicatedDeclaration
        var options = {
            method: 'GET',
            url: urlForPRsearch,
            headers: {
                'User-Agent': 'request'
            }
        };

        function callbackForPRSearch(error, response) {
            if (!error && response.statusCode === 200) {
                res.send(response);
            }
            else {
                res.send(response); //send back response if not 200, but needs to be updated to handle exception.
            }
        }

        request(options, callbackForPRSearch);
    }

使用特定库中的Github API显示拉取请求列表

2 个答案: