渲染反应状态时将 img src 包装在“”中

Wrapping img src in " " when rendering react state

我有一个小应用程序,它使用 giphy API 来获取 GIF 并将其显示为图像。

<img src={this.state.gifUrl} alt="mood"></img>
        <p> here it is: {this.state.gifUrl}</p>

图像 URL 打印出来很好,但显示的是空白图像。我如何使用“”包装我的反应表达式使其有效HTML

你只需要以下内容,JSX 会自动为你包装。如果它没有正确显示,我会仔细检查 URL 以确保它解析为实际图像而不是叶子页面。

<img src={this.state.gifUrl} />

这是一个有效的例子。传递一个变量来渲染 src 属性

const Img = () => { 常量数据 = 'https://www.catster.com/wp-content/uploads/2018/07/Savannah-cat-long-body-shot.jpg' return ( ) }