[英]Curly braces with ` on React
I've a small problem with rendering. 我在渲染方面有一个小问题。
const Image = React.createClass({
getInitialState(){
return{
imgUrl: 'cat.jpg'
}
},
handleChange(e){
e.target.classList.toggle('active')
},
render(){
return (
<div className="handler"
style={{backgroundImage: 'url(' + this.state.imgUrl + ')'}}
onClick={this.handleChange}>
</div>
)
}
})
ReactDOM.render(
<Image />,
document.getElementById('home')
)
Right now I'm adding style for my div this way: 现在,我以这种方式为我的div添加样式:
style={{backgroundImage: 'url(' + this.state.imgUrl + ')'}}
When I'm trying to write this way: 当我尝试以这种方式编写时:
`url({this.state.imgUrl})`
it just adds %7D and %7B symbols of { } 只会添加{}的%7D和%7B符号
What's the correct way to write it and how I can to avoid " + " 什么是正确的书写方式以及如何避免使用“ +”
Hope someone will help with this easy question :) 希望有人可以帮助您解决这个简单的问题:)
It should be `url(${this.state.imgUrl})`
. 它应该是`url(${this.state.imgUrl})`
。
For your information, It is called Template literals . 供您参考,它称为模板文字 。 See this MDN doc to get more information. 请参阅此MDN文档以获取更多信息。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.