1

嘿,伙计们,希望你们一切都好。我是 react js 的新手,我在修复这个错误时遇到了一些困难。TypeError:无法在“URL”上执行“createObjectURL”:重载解析失败。我会告诉你我的代码。我希望有人可以帮我解决它。先感谢您

<Box display="flex" flexWrap="true">
              {this.state.images.map((item, index) => (
                <Box margin="12px">
                  <img
                    alt=""
                    src={this.renderImageUrl(item)}
                    style={{
                      height: "90px",
                      width:
                        this.state.view_type === 0
                          ? "160px"
                          : this.state.view_type === 1
                          ? "210px"
                          : 0,
                      objectFit: "scale-down",
                      backgroundColor: this.state.colors[index],
                    }}
                  />
                  <br />
                  <input
                    id={"contained-button-" + index}
                    type="color"
                    hidden
                    onChange={(e) => {
                      let colors = this.state.colors;
                      colors[index] = e.target.value;
                      this.setState({
                        colors,
                      });
                    }}
                    defaultValue="#000000"
                  />

                  <IconButton
                    aria-label="delete"
                    onClick={(e) => this.removeImage(index)}
                  >
                    <Delete />
                  </IconButton>

                  <label htmlFor={"contained-button-" + index}>
                    <IconButton
                      color="primary"
                      aria-label="upload picture"
                      component="span"
                    >
                      <FormatColorFill />
                    </IconButton>
                  </label>
                </Box>
              ))}
            </Box>

这是我正在使用的方法:

renderImageUrl = (item) => {
    return URL.createObjectURL(item);
  };

当我把这样的方法:

 renderImageUrl = (item) => {
    try {
      return URL.createObjectURL(item);
    } catch (error) {
      return item;
    }
  };

所以结果将是: 在此处输入图像描述

4

0 回答 0