关于react 一个问题(Render HTML string w/JSX expression)


问题是这样的,先上代码:

 render() {
        var articleInfo = this.props.articleInfo.item;
        return(
                <div className="mainContainer">
                    <div className="profile"></div>
                    <div className="mainList">
                        <div>{articleInfo.title}</div>
                        <div>{articleInfo.content}</div>
                    </div>
                </div>
        )
    }

这里面的articleInfo.content,是直接由markdown解析的带标签的文章,有很多p标签a标签什么的,如果直接现在这样写在这里面,标签是不会被解析的,会被当作字符串解析出来。现在我想要这里面的内容被浏览器按照html解析出来,该如何做?

找到一个类似问题:http://stackoverflow.com/ques... 但是答案并不是我想要的。

Vue中这个问题非常方便解决,react应该也有类似的方便的解决方案吧?


自问自答好了。

react有这样的解决方案:

<div dangerouslySetInnerHTML={{__html: articleInfo.content}}></div>

<div dangerouslySetInnerHTML={{__html: articleInfo.content}}></div>



相关阅读:
gulp合并js代码问题
mysql怎么实现mssql的if exists() begin...end功能?
关于mongodb多表和检索查询
brew install php56-redis 安装错误
vue2.0时如何结合highlight.js实现代码高亮的?
程序怎么判断windows的隐藏文件/文件夹?
react 父组件怎么获取子组件的这个值?
react,多个节点执行同一个事件,怎么区分启动事件的是哪个节点?
跨域修改css样式
mac下用chrome浏览器和safiri运行总是出问题?
列表分割数据输出
关于django model relation set的设置问题
新闻类app,每次上拉和下拉刷新都有数据,逻辑是怎样的,如何防止重复?
ios系统cursor: pointer失效
谁能用通俗易懂的言语解释一下区块链中的节点和区块的意思啊
怎么取出排序后字典中的第一个键值对
position定位,设置top为百分数,如何计算?
python 中文写入文件后乱码
jquery实现鼠标滚动时元素消失,不滚动的时候元素回来?
vue2函数化组件的问题



快速导航

Copyright © 2016 phpStudy |