Question

我有一个如下所示的父容器：

const HomeContainer =  Relay.createContainer(HomeClass, {
    initialVariables: {
        first: 66,
        userIdAndCookie: {
            id: "",
            cookie: ""
        },
        filterBy: {subTypes: ["Event","Social Media Photography"]}
    },

    fragments: {
        allUsersFragment: ($params) => Relay.QL`
            fragment on AllUsers {
                ${UserBoxList.getFragment('allUsersFragment', $params)}
            }
        `,
    }
}

一个嵌套的容器，如下所示：

export default Relay.createContainer(UserBoxList, {
    initialVariables: {
        first: 600,
        filterBy: null
    },

    fragments: {
        allUsersFragment: ({$first, $filterBy}) => Relay.QL`
            fragment on AllUsers {
                allUsersField(first: $first, filterBy: $filterBy) {
                    edges {
                        node {
                            id,
                            name,
                            surname,
                            businessName,
                            rating,
                            supplierType,
                            locationNames,
                            locationZips
                        }
                    }
                }
            }
        `
    }
});

HomeContainer正确地将参数传递给UserBoxList，当我查看网络选项卡时，我正确地接收了使用正确参数完成的查询中的所有数据。但是，当我这样做时：

const users = this.props.allUsersFragment.allUsersField.edges.map(user => {
    if(user.node.supplierType === this.props.selectedSupplierType) {
        return (
            <UserBox
                usernode={user.node}
                key={user.node.id}
                showCreateTaskRequestBox={this.props.showCreateTaskRequestBox}
            />
        )
    }
});

在我的UserBoxList中，allUsersField未定义。当我查看this.props.allUsersFragment时，我看到了这一点：

Object {__dataID__: "client:-222288344603", __status__: 4}

但没有数据！即使我可以在网络标签中看到数据：

{data: {,…}}
data
:
{,…}
allUsersQuery
:
{_allUsersField1YSY3b: {edges: [{,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…},…],…}}
_allUsersField1YSY3b
:
{edges: [{,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…},…],…}
edges
:
[{,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…}, {,…},…]
pageInfo
:
{hasNextPage: true, hasPreviousPage: false}

我的问题是，我错过了一些明显的东西吗？或者这是一个错误吗？

修改

如果我删除从Home传递的变量 - ＆gt; UserBoxList，只需使用在UserBoxList中initialVariables，它可以正常工作。

在初始渲染时，UserBoxList中继变量不是我从Home传递的变量，它们是来自UserBoxList容器中initialVariables的变量，但是实际进行的唯一查询是使用正确的参数进行的。来自Home容器

EDIT2

显然github上也有一个关于同一问题的问题：

https://github.com/facebook/relay/issues/1101

Answer 1

约瑟夫萨沃纳的这个答案对我有用：

请务必在道具中传递任何被覆盖的变量，因此<Child customerId={this.props.relay.variables.customerId} ... />。

即使查询成功，Relayjs片段在子容器上也不可用

1 个答案: