reactjs – 如何使用反应动态设置HTML5数据属性？

我想渲染一个< select>的 HTML5属性输入,以便我可以使用jquery图像选择器做出反应.我的代码是：

var Book = React.createClass({
    render: function() {
        return (
            <option data-img-src="{this.props.imageUrl}" value="1">{this.props.title}</option>

问题是即使{this.props.imageUrl}被正确地传递给支持,它也不会在HTML中呈现 – 它只是渲染为{this.props.imageUrl}.如何使变量正确传递到HTML中？

解决方法

你不应该用引号包装JavaScript表达式.

<option data-img-src={this.props.imageUrl} value="1">{this.props.title}</option>

看看the JavaScript Expressions docs了解更多信息.