来自API的Reactjs avatar src

Question

我试图在Modal上显示一个头像， 我的州有头像网址：

this.state.example.fields.assignee.avatarUrls.48x48

<div>
   <img src='this.state.example.fields.assignee.avatarUrls.48x48'></img>
</div>

图像不会出现，我试过{{}}，``，...

Answer 1

您应该正确传递src值并正确访问48x48字段：

<img src={this.state.example.fields.assignee.avatarUrls['48x48']} />

这是显示图像的一个非常基本的例子：

class Image extends React.Component {
  constructor(props) {
    super(props)
    
    this.state = {
      imageURL: {
        '48x48': 'https://images.pexels.com/photos/735811/pexels-photo-735811.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260'
      }
    }
  }
  
  render() {
    return <img src={this.state.imageURL['48x48']} width='500' />
  }
}

ReactDOM.render(
  <Image />,
  document.getElementById('container')
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>