如何使用Relay Modern突变进行文件上传？

Question

我正在使用react-relay/compat 1.1.0 ，我需要编写一个能够上传文件的变异。 在Relay Classic中，您可以使用getFiles()来支持突变中的文件上传：

class AddImageMutation extends Relay.Mutation {
   getMutation() {
     return Relay.QL`mutation{ introduceImage }`;
   }

   getFiles() {
     return {
       file: this.props.file,
     };
   }
   ...
}

但是在Relay Modern文档中没有找到任何上传文件的功能：

const {commitMutation} = require('react-relay');

commitMutation(
  environment: Environment,
  config: {
    mutation: GraphQLTaggedNode,
    variables: Variables,
    onCompleted?: ?(response: ?Object) => void,
    onError?: ?(error: Error) => void,
    optimisticResponse?: ?() => Object,
    optimisticUpdater?: ?(store: RecordSourceSelectorProxy) => void,
    updater?: ?(store: RecordSourceSelectorProxy) => void,
    configs?: Array<RelayMutationConfig>,

    // files: ... ?
  },
);

接力现代还支持吗？ 如果是这样，这样做的方式是什么？ 谢谢。

Answer 1

您必须在commitMutation的config对象中提供文件作为对象uploadables文件，然后在网络层中实现实际上载，因为对服务器的提取请求必须是多部分表单而不是application / json。

有关完整示例，请参阅https://github.com/facebook/relay/issues/1844#issuecomment-316893590 。

Answer 2

发现这个问题，因为我自己也有同样的问题。

不知道完整的答案还没有，但我开始通过继电器读取源和基于包/继电器运行时/突变/ commitRelayModernMutation.js它看起来像你可以通过uploadables你的突变。