doupao6011 2016-11-23 00:58
浏览 90

从容器中渲染与HTML混合的React组件

I have an APP that works well, but it has to embed within an "article", so it would be, in the simplicity:

<h1>...</h1>
<p>...</p>
<MyComponent key={1} data={data[0]} />
<p>...</p>
<MyComponent key={2} data={data[1]} />

The issues are:

  1. There will be html tags and components mixed
  2. My server is in PHP and the app has to be embed in a php file

I have tried sending the data from the rendered content to the render function (I know that there has to be some treatment in order to make it a component, I tried: - https://github.com/roman01la/html-to-react-components - https://www.npmjs.com/package/html-to-react

componentWillMount() {
        this.content = document.getElementById('root').innerHTML
    },
    render() {
    return (
          <div>
            {this.content}
          </div>
        )
    }

Is there a way that I can mix html tags (an article) with components inside of it and parse them to mount the components in that html?

  • 写回答

1条回答 默认 最新

  • duanguo7021 2016-11-23 01:45
    关注

    If you want to render a html string inside a component you can do it.
    this should work:

    render() {
       return (
         <div dangerouslySetInnerHTML={{__html: this.content}} />
       )
    }
    

    https://facebook.github.io/react/docs/dom-elements.html#dangerouslysetinnerhtml

    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 MATLAB动图问题
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名