我承认我对Relay一无所知,但message
传递给Echo
它的属性似乎正在影响它(或以其他方式影响它).我做了以下更改:
将传递的道具名称更改为Echo
:
更改属性名称componentDidMount
:
componentDidMount() {
let {relay, defaultMessage} = this.props;
relay.setVariables({
message: defaultMessage
});
}
以下是完整的源代码(以及指向工作示例的链接):
class Echo extends React.Component {
componentDidMount() {
let {relay, defaultMessage} = this.props;
relay.setVariables({
message: defaultMessage
});
}
render() {
let name = '';
if (this.props.echo) {
name = this.props.echo.name;
}
return (
Message: {name}
);
}
}
Echo = Relay.createContainer(Echo, {
initialVariables: {
message: ""
},
fragments: {
echo: () => Relay.QL`
fragment on Echo {
name(message: $message)
}
`,
},
});
class EchoApp extends React.Component {
render() {
return
;
}
}
EchoApp = Relay.createContainer(EchoApp, {
fragments: {
viewer: () => Relay.QL`
fragment on Viewer {
echo { ${Echo.getFragment('echo')} },
}
`,
},
});
class EchoRoute extends Relay.Route {
static routeName = 'Home';
static queries = {
viewer: (Component) => Relay.QL`
query {
viewer { ${Component.getFragment('viewer')} },
}
`,
};
}
ReactDOM.render(
,
mountNode
);