中继 createContainer renderFetched 未将必需的道具传递给组件

Relay createContainer renderFetched is not passed required props to component

我是中继的新手,很高兴能使用它,但是我的代码卡住了将近一天,不知道哪个有问题,这是非常简单的代码

这是我的查询路线

class UserRoute extends Route {
  static paramDefinitions = {
    userId: { required: true }
  };
  static queries = {
    user_by_id: () => Relay.QL`
      query {
        user_by_id(id: $userId)
      }
    `
  };
  static routeName = 'UserRoute';
}

这是我的组件

class UserInfo extends Component {
  render() {
    console.log('this.props.user', this.props.user_by_id);
    return (
      <Text>name: {this.props.user_by_id.name}</Text>
    )
  }
}

这里是中继容器

UserInfoRelay = Relay.createContainer(
  UserInfo,
  {
    fragments: {
      user_by_id: () => Relay.QL`
        fragment on User {
          name
        }
      `
    }
  }
)

这是我的根容器

<RootContainer
  Component={UserInfoRelay}
  route={new UserRoute({userId: 5})}
  renderFetched={(data) => <UserInfo {...this.props} {...data} />}
/>

返回的 graphql 查询是正确的

Log from my relay

但是我没有得到想要的道具 "name"

This is props i get from log

我做错了什么?谢谢你的帮助,对我来说接力很有希望,但跳进去很流血☠️☠️☠️☠️☠️☠️☠️☠️

祝你有美好的一天

解决方案是改变这个

UserInfoRelay = Relay.createContainer(
  UserInfo,
  {
    fragments: {
      user_by_id: () => Relay.QL`
        fragment on User {
          name
        }
      `
    }
  }
)

进入

UserInfo = Relay.createContainer(
  UserInfo,
  {
    fragments: {
      user_by_id: () => Relay.QL`
        fragment on User {
          name
        }
      `
    }
  }
)

这确实帮助我获得了想要的道具,但我不知道为什么,谁能解释一下这个解决方案

干杯