Question

我正在尝试编写一个onClick函数，该函数将从显示的输入数组中删除最后添加的图像。

这是我的代码：

<div>
  <form>
    <input type="file" name="pic" accept="image" onChange={this.handleClick} multiple />
    <input type="submit"/>
    <button className={"clear"}>Clear last image</button>
  </form>
</div>
<div style={formStyle}>
  {this.state.array.map((item, i) =>
    <img
      style={imgStyle}
      src={URL.createObjectURL(item)}
      key={i} 
    />
  )}
</div>

在这里，我获取用户的输入图像文件并将其添加到状态数组中，然后显示该数组。我找不到与之直接相关的帖子，但是有没有一种最佳方法可以从DOM中删除最后上传的图片标签？

Answer 1

您似乎可以从数组中删除最后一项并更新状态

long seed=97128757896197L;
Random r= new Random(seed );
System.out.println(r.nextGaussian());
System.out.println(r.nextGaussian());

-

clearLast = (e) => {
  e.preventDefault();
  this.setState({
    array: this.state.array.slice(0, -1)
  });
}

修改，其中有上述更改

由于按钮位于表单内部，因此单击时将导致表单提交。如果您使用<button className={"clear"} onClick={this.clearLast}>Clear last image</button>，它将停止此行为。

另外，我认为您也许可以像这样添加e.preventDefault()

type="button"

然后无论如何都不会提交表单

如何从显示中删除图像标签

1 个答案: