dqh1992 2015-05-29 11:00
浏览 116

ReactJS重新渲染/重绘服务器生成的视图

So I have this app, Lets say it is similar to Facebook posting something on your wall,

Everything is rendered on a PHP server / Codeigniter Framework and sent to the client, I need these posts to be rendered using ReactJS because I have awesome things I like to do inside each of these post

  1. Like
  2. Comment
  3. Edit / Report

I DO NOT WANT TO USE V8JS, because the client can not play with the php servers, just need the php script to work that's it,

Any thoughts how I could do this guys? Thanks so much,

One Idea is to may be,

Load the posts as server rendered and then do a GET request and render the same posts again using ReactJS? Will that work?

Or is there a way to attach all ReactJS functions and events to a server rendered html page?

  • 写回答

1条回答 默认 最新

  • doushuhuai7247 2015-05-29 12:18
    关注

    For React on the client/web browser to attach to an existing DOM structure (that was server rendered for example), it uses an attribute called data-react-checksum which is added to the root DOM element. Calling React.renderComponentToString for example will include this attribute.

    <div data-react-checksum="452232529">
    

    When you call renderElement on the same root element, React executes as normal calling render, etc. But, at the end of the render cycle, the data-react-checksum is compared to what was locally computed. If the value matches what was already in the DOM (provided by the server), the Virtual DOM attaches to the existing DOM elements. But to do that, as I mentioned it must match exactly.

    Further, you'd need to also include the data-reactid attribute on the DOM elements that would be normally associated with React's virtual DOM.

    If you can't execute the React render pipeline on the web server, you should rely on using Ajax to fetch the data. You could render the entire page via PHP, then fetch the data on the client and re-render the page. But, you'll need to decide if that makes sense for your application and users.

    I'd suggest you consider just using React for the interactive sections of your web page, and construct those entire on the client as needed.

    评论

报告相同问题?

悬赏问题

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