Javascript 在React js html输入文件表单中预填充图像字段?

Javascript 在React js html输入文件表单中预填充图像字段?,javascript,reactjs,axios,Javascript,Reactjs,Axios,除图像字段外,所有内容都已预填充。因此,我在当前图像标签上显示了图像。由于图像字段未预填充,因此填充图像已成为必需的,它显示您需要选择文件 下面是代码 async handleImage(e, index) { if (["file"].includes(e.target.name)) { let file = [...this.props.registration]; cats[index][e.target.name] = e.target

除图像字段外,所有内容都已预填充。因此,我在当前图像标签上显示了图像。由于图像字段未预填充,因此填充图像已成为必需的,它显示您需要选择文件

下面是代码

async handleImage(e, index) {
    if (["file"].includes(e.target.name)) {
      let file = [...this.props.registration];
      cats[index][e.target.name] = e.target.files[0];
      await this.setState({
        cats,
      });
    } else {
      this.setState({ [e.target.name]: e.target.files[0] });
    }
  }

 <div id="registration" className="modal">
        <a href="# " rel="modal:close" className="float-right text-dark ">
          <img src={cross} alt="Cross" style={{ height: "1.1em" }} />
        </a>
        <p className="mod" style={{ marginTop: "10px" }}>
          {t("vehicle_registration").toUpperCase()}
        </p>
        <hr></hr>

        <div className="file_upload" style={{ marginTop: "25px" }}>
          <form onSubmit={this.props.submit1}>
            {this.props.registration
              .slice(0, 2)

              .map((inputField, index) => (
                <div className="row">
                  <div className="form-group">
                    <input
                      type="text"
                      name="category"
                      class="form-control "
                      hidden
                      value={(inputField.category = "Vehicle-registration")}
                    />
                  </div>
                  <div className="form-group">
                    <select
                      name="sub_category"
                      class="form-control donn"
                      value={inputField.sub_category}
                      onChange={(e) => {
                        this.onChange(e, index);
                      }}
                      style={{ width: "220px" }}
                    >
                      <option value="" selected display hidden>
                        Select Category
                      </option>
                      <option value="Registration Documentation">
                        Registration Documentation
                      </option>
                      <option value="Plate Number Documentation">
                        Plate Number doc
                      </option>
                    </select>
                  </div>
                  <div class="form-group">
                    <input
                      type="file"
                      name="file"
                      defaultValue={inputField.file}  // There it i tried to give default value but its not working
                      onChange={(e) => {
                        this.handleImage(e, index);
                      }}
                      class="form-control-file"
                      id="exampleFormControlFile1"
                    />
                  </div>
                </div>
              ))}


            <div style={{ marginTop: "70px" }}>
              <center>
                <button
                  type="submit"
                  value="Get Data"
                  className="btn btn-login text-white font-weight-bolder boxx "
                  id="button1"
                  style={{
                    height: "40px",
                    fontSize: "13px",

                    width: "200px",
                    background: "rgba(183, 28, 28, 1)",
                    border: "none",
                    color: "white",
                    margin: "auto",
                  }}
                >
                  SAVE
                </button>
              </center>
            </div>
          </form>
        </div>
      </div>
异步handleImage(e,索引){ 如果([“文件”].includes(e.target.name)){ 让file=[…this.props.registration]; cats[index][e.target.name]=e.target.files[0]; 等待这一天({ 猫, }); }否则{ this.setState({[e.target.name]:e.target.files[0]}); } }

{t(“车辆登记”).toUpperCase()}


{this.props.registration .slice(0,2) .map((输入字段,索引)=>( { 这一变化(e,索引); }} 样式={{width:“220px”} > 选择类别 登记文件 车牌号文件 { 这个.handleImage(e,索引); }} class=“表单控制文件” id=“exampleFormControlFile1” /> ))} 拯救 如果我正在填写表格,那么它会被更新

我希望用来自API的数据预先填充图像。填充图像应该是可选的。若用户并没有填充它,那个么相同的图像应该被更新

请帮我做这个

提前谢谢