问无法从Github的GraphQL渲染嵌套的道具
EN

Stack Overflow用户

提问于 2016-12-19 01:05:56

回答 0查看 197关注 0票数 3

我正在尝试获取一些Github's GraphQL data并使用React & Relay显示它。我遇到的两个问题是，relay似乎正在向响应添加别名(使其难以引用)，并且并不是所有查询的项都会传递到我的组件props中。在下面的代码中，我可以呈现this.props.relay.variables.name，但在尝试在this.props.relay.variables.issues上循环时未定义

// AppQuery.js
import Relay from 'react-relay'
export default {
  relay : Component => Relay.QL `
    query {
      relay {
        ${Component.getFragment('relay')}
      }
    }
  `
};

// AppContainer.js
import Relay from 'react-relay'
import App from './AppComponent'

export default Relay.createContainer(App, {
  initialVariables: {
    owner: "rails",
    name: "rails",
    count: 10
  },
  fragments: {
    relay: () => Relay.QL `
      fragment on Query {
        repository(owner: $owner, name: $name) {
          name
          owner
          description
          issues(first: 20) {
            edges {
              node {
                title
              }
            }
          }
        }
      }`
  }
});

//AppComponent.js
export default class App extends React.Component {
  render() {
    return (
      <div>
        <h1>{this.props.relay.variables.name}</h1>
        <ul>
          { this.props.relay.variables.issues.edges.map((issue) => {
            return(<li>{issue.node.title}</li>)
          })}
        </ul>
      </div>
    );
  }
}

在响应预览中，我似乎成功地获取了指定的数据。