react ajax后台交互,React.js 怎么和后端交互?

javascript

var One = React.createClass({

render: function(){

return (

<div>我是第一个组件</div>

);

}

});

var Two = React.createClass({

render: function(){

return (

<div var="data">我是第二个组件</div>

);

}

});

ReactDOM.render(

<div>

<One /><Two />

</div>,

document.getElementById('app')

);

html

<div id="app"></div>

把html页面按组件加载出来，但是假如我“Two”组件的“var”是需要后端assign的，那我要用什么方式去获取到这个assign的值？

如果是纯html的话还可以按照后端要求直接写标识符让后端渲染出来，如：

html

<div var="{dataVar}">我是第二个组件</div>

但显然如果用React.js渲染的话不能用这种方法，难道每个数据都要用ajax吗？这样页面加载的时候还要执行ajax不是速度变慢了？

还是我的开发方式不对？

查看了各类文章终于找到了解决方法。

假如是用php的可以使用php扩展 v8js 不过需要php版本 >= 7

因php版本问题只能放弃，转而使用node.js，有需要可以参考文章：点我点我

PS：node.js的参考文章有部分错误

reactify不能用字符串，需要加载reactify组件，没有的话需要

npm install reactify --save-dev

<MyComponent number={initProps.num} />

服务端渲染，ajax

https://segmentfault.com/a/1190000005040834

参考这个吧，里面有对后端请求方面的内容

推荐阅读w3school的ajax部分

http://www.w3school.com.cn/ajax/

还有js控制html dom的部分帮助理解，虽然react不需要你直接控制dom，但毕竟是这么个道理

http://www.w3school.com.cn/js/js_htmldom_html.asp

在最外层的 做“同步的”AJAX请求 然后通过props把数据分发到各个组件上

fetch api