php - React如何从后端获取数据并渲染到前端?
黄舟
黄舟 2017-04-10 16:46:21
[PHP讨论组]

初学react,理解不对请指出:D

我们知道,传统的后端开发,是在页面结构中嵌入数据,在服务器中解析出来,例如:

//test.php

    

一旦访问了test.php,那么服务器端的PHP解释器就会把 里面的代码进行解释,转换为hello,返回给浏览器。

那么问题来了,我现在有一个react 组件,但是在react组件中不能直接嵌入php等后端代码,(因为实在前端完成解析/渲染),所以想请问如何更好与嵌入后端数据?

想到的办法是:

  • Ajax异步请求,获取结果并插入?

  • 后端把数据输出到JSON文件中,在前端读取JSON并渲染页面? (如果数据有变,那维护这个JSON文件岂不也是一件麻烦事?)

想请问各位如何处理这个问题?

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

全部回复(5)
PHP中文网

React.js 自己的定位是“A JavaScript Library for building user interface”,它的文档称许多人将它用作 MVC 的 V。因此,React.js 不关心你是如何嵌入后端数据的。换句话说,我们怎么使用一个标准的 HTML 元素和后端打交道,就可以把同样的思路运用在 React.js 创造的组件上。

比如,一个 input,可以:

<input id="name" name="name" value="<?=$name?>">

的方式从 PHP 得到变量 $name

一个 React.js 组件也可以形如:

ReactDOM.render(React.createElement(HelloMessage, { name: "<?=$name?>" }), mountNode);

用标准元素你可以用 AJAX 得到一个值然后(比如用 jQuery 去)操作:

$.ajax(...)
  .done(function(data){
    $('#name').val(data.name);
  });

用 React.js 时,同样可以在 AJAX 返回时使用你自己定义的方法去更新组件。

关于维护 JSON 信息麻烦的事情,怎么会呢?在 PHP 中 echo $var;echo json_encode($var); 的麻烦程度是一个量级的。

巴扎黑

后端用nodejs或者php做restful api , 前端react里用jquery的ajax获取数据,然后把数据添加给this.state , 然后在render里把this.state的数据显示出来, 用户交互那块也是ajax获取数据再更新this.state然后react自动更新dom界面

应该就是这样,我也是个菜鸟@—@

PHP中文网

通过ajax,先加载网页模板,再加载数据,但是这样会多几次请求

粗暴地在后端把数据直接输出到scirpt标签,作为一个全局对象,随地读取

巴扎黑

React.js 结合 Fetch.js

天蓬老师

用webpack打包,html文件的body里面什么元素都没有,都是react动态渲染出来的。获取数据使用ajax,赋值给this.state

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号