首页 文章

如何使用新的Image（）进行反应

提问于
浏览 次
5

我试图在状态改变时保持图像不重新加载 . 下面的图像变量被传递到自定义反应组件的道具中 .
var img = new Image（）;我已经设置了src，title，desc等 .

所以我的问题是 . 在自定义反应组件中，如何获取图像对象（现在是 Headers 为img的道具）并将其显示在渲染功能中？

我已经试过了

render: function(){
  return <div>{this.props.img}</div>
}

但我一直得到一个DOM元素是React组件错误无效的子元素 .

javascript image reactjs

1 回答

  • 6

    我认为你要做的是创建一个新的Image类型的DOMNode，并将其呈现为 <div> 的孩子 . 如果那个's right, you'正在做某事React是不能做的 . 两种选择：

    Option 1 (Best): 在React组件模板中渲染图像标记

    render: function() {
    return (
        <div>
            <img src={'url-to-your-image'} />
        </div>
    );
}

    Option 2 (Not as good): 将图像渲染为HTML字符串实体

    renderHTML: function() {
    return {
        __html : '<img src="url-to-your-image" />'
    }
},

render: function() {
    return (
        <div dangerouslySetInnerHTML={this.renderHTML()} />
    );
}

    希望有所帮助！

    回复于

相关问题