【问题标题】:how to convert the binary data to image in reactjs如何在reactjs中将二进制数据转换为图像
【发布时间】:2017-06-17 18:23:46
【问题描述】:

我已将图像插入数据库,并且我正在从数据库接收图像到服务器和 reactjs,但在我的反应中我收到它有二进制数据。 但是我如何在反应中将二进制数据转换为图像。

class Pre extends React.Component{
  constructor(props){
    super(props);
    this.state={
      post:[]
    };

  }


componentDidMount(){
   let self = this;
  axios.get('http://localhost:8080/images')
  .then(function(data) {
      //console.log(data);
      self.setState({post:data.data});
      });
  }


  render(){

console.log(this.state.post);
    return(
    <div className="w3-container">


    <p className="addboard"> <Link className="linkpre"  to="/createstudent I">
      <button className="addbutton" type="button"><h1>+</h1></button></Link></p>


      {this.state.post}

)}
)}

</div>

    );
  }
}
export default Pre;

【问题讨论】:

    标签: javascript reactjs


    【解决方案1】:

    将二进制数据转换为图像与ReactJS无关,如果您有二进制数据然后将其转换为图像,如下所示:

    <img src={`data:image/jpeg;base64,${binary_data}`} />
    

    【讨论】:

    • 不适合我我的控制台中仍然有这个 ���� 并且图像不显示
    【解决方案2】:

    给定的方法是正确的,

    <img src={`data:image/jpeg;base64,${binary_data}`} />
    

    如果您的图像未呈现,请检查您的二进制字符串,如果 data:image/jpeg;base64 已经存在,请使用 {binary_data}直接地。喜欢

    <img src={binary_data} />
    

    【讨论】:

      猜你喜欢
      • 2020-10-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-02-10
      • 2012-05-26
      相关资源
      最近更新 更多