reactjs - RelayJS: props を介して initialVariables を設定する方法

Question

Echoいくつかの装飾を使用してクエリを実行する GraphQL タイプがあるとします。一方、タイプmessageによって決定されるいくつかの装飾を使用してエコーが渡されるReact コンポーネントがあります。コンポーネントのEcho設定方法を教えinitialVariablesてください。Echo

props setsinitialVariablesの設定を読みましたが、うまくいきません。試してみcomponentDidMountましたが、それもうまくいきません。

このRelay Playgroundは、メッセージが正しく表示されていないことを示しています。

コンテキストについては、

// This component consumes `Echo` type
class Echo extends React.Component {
  componentDidMount() {
    let {relay, message} = this.props; 

    relay.setVariables({
      message
    });
  }

  render() {
    let name = '';
    if (this.props.echo) {
      name = this.props.echo.name;
    }

    return (
      <li>Message: {name}</li>
    );
  }
}

Echo = Relay.createContainer(Echo, {
  // By default `message` is null
  initialVariables: {
    message: null
  },

  fragments: {
    echo: () => Relay.QL`
      fragment on Echo {
        name(message: $message)
      }
    `,
  },
});

エコーで解決するタイプです

let EchoType = new GraphQLObjectType({
  name: 'Echo',
  fields: () => ({
    name: {
      type: GraphQLString,
      args: {
        message: {
          type: GraphQLString
        }
      },
      resolve: (echo, {message}) => `Hello, ${message}!`
    }
  })
});