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

时间:2017-07-24 19:32:21

标签: graphql relay relaymodern

我正在使用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 docs中找不到任何上传文件的功能:

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: ... ?
  },
);

现代接力是否支持?如果是这样,这样做的方式是什么?感谢。

2 个答案:

答案 0 :(得分:2)

您必须在uploadables config对象中为commitMutation提供文件作为对象public class SomeController : Controller { [HttpGet] public ActionResult Index() { ModelClass model = new ModelClass(); return View(model); } [HttpPost] public ActionResult Index(ModelClass data) { if (data != null) { data.ReadData(); return View(data); } else { return new HttpStatusCodeResult(HttpStatusCode.BadRequest); } } [HttpPost] public FileContentResult DownloadCSV(ModelClass data) { if (data != null) { // generate CSV } else { // ... } } } ,然后在网络层中实现实际上传,因为对服务器的获取请求必须是一个多部分形式而不是application / json。

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

答案 1 :(得分:1)

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

还不确定完整的答案,但我开始阅读Relay源并基于packages / relay-runtime / mutation / commitRelayModernMutation.js看起来你可以将uploadables传递给你的突变。