渲染反应状态时将 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 (
)
}
我有一个小应用程序,它使用 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 ( ) }