如何将Redux-Form字段数组与文件类型输入一起使用

Question

以redux格式，当创建输入type="file"的字段数组时，弹出Fields.remove(index)而不是删除。

我认为这可能与#2666 on github中讨论的使用key={index}有关，但是使用唯一生成的密钥并不能解决此错误。

如何使Fields.remove(index)与input type="file"数组一起正常工作？

import React from "react";
import { reduxForm, Field, FieldArray } from "redux-form";

const Guid = () => {
  const s4 = () =>
    Math.floor((1 + Math.random()) * 0x10000)
      .toString(16)
      .substring(1);
  return `${s4()}`;
};

const renderField = ({ fields, input, handleDelete, index, label }) => (
  <div>
    <input type="file" {...input} />
    <label>
      {" "}
      - id: {label}, index = {index}
    </label>
  </div>
);

const renderFieldList = ({ fields }) => (
  <div>
    {fields.map((field, index) => {
      const { id } = fields.get(index);
      return (
        <div key={index}>
          <Field
            name={field}
            component={renderField}
            index={index}
            label={id}
          />
          <button type="button" onClick={() => fields.remove(index)}>
            Delete
          </button>
        </div>
      );
    })}

    <button type="button" onClick={() => fields.push({ id: Guid() })}>
      Add
    </button>
  </div>
);

const MyForm = ({ handleSubmit }) => (
  <form onSubmit={handleSubmit}>
    <FieldArray name="foo" component={renderFieldList} />
  </form>
);

export default reduxForm({
  form: "form",

  onSubmit: values => {
    window.alert(JSON.stringify(values, null, 2));
  }
})(MyForm);

Example