相关疑难解决方法(0)

如何在React中将二进制数据显示为图像?

我从Nodejs服务器收到一个bindata,现在我需要显示一个图像.

我怎样才能做到这一点?有没有什么方法可以将bindata转换为JPEG或任何其他格式?或者是否可以在服务器中转换它然后发送该图像作出反应?

这是我试图item.Image.data.data用图像标记显示二进制数据()的方法:

<img src={item.Image.data.data} />
Run Code Online (Sandbox Code Playgroud)

这是我详细的反应代码片段:

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

<ul className="w3-ul w3-card-4 w3-light-grey">
  { this.state.post.map((item, index) => {
    return (
      <Link  to="/displaylist" style={{ textDecoration: 'none' }} key={index}>
        <li className=" w3-hover-green w3-padding-16" onClick={this.handleClick(item.Id)}>
          <img src={item.Image.data.data} className="w3-left w3-circle w3-margin-right" width="60px" height="40px" />
          <span>{item.Firstname}</span><br/><br/>
        </li>
      </Link>
      )}
  )}
</ul>
Run Code Online (Sandbox Code Playgroud)

这是我的nodejs代码片段:

server.get('/list', function(req, res) {
    databaseInterface.listStudent(function(err, students) {
      var myJSON = students;

      res.json(myJSON);
      // You should see the newly saved student here …
Run Code Online (Sandbox Code Playgroud)

javascript node.js reactjs

15
推荐指数
3
解决办法
4万
查看次数

标签 统计

javascript ×1

node.js ×1

reactjs ×1