React主要功能在于渲染HTML。可以将其看成是MVC中的V,它不会影响到组件中直接调用AJAX请求之类的操作:
var TakeSurvey=React.CreateClass({
getInitialData:function(){
return{
survey:null
};
},
componentDidMount:funciton(){
$.getJSON('/survey/'+this.props.id,function(json){
this.setState({survey:json});
});
},
render:function(){
return <div>{this.state.survey.title}</div>
}
});
路由在单页面应用里为URL指定处理器函数。假设要为URL/surveys运行一个函数,函数的功能是从服务器加载用户,然后渲染<LIstSurveys>组件。
路由有很多种,在服务器端也存在路由,有一些路由可以在客户端和服务器端运行。
React仅仅是一个一个的渲染类库,没有路由的功能,不过有很多路由模块可以搭配React使用。
1、Backbone.Router:
Backbone是单页面应用类库,采用了MVX(Model-View-Whatever)架构。其中X指代控制器(Controller),通常指代的是路由。对Backbone来说就是如此。
Backbone是模块化,你可以只用它的路由功能。它可以和React很好的搭配在一起使用。例如:
var SurveysRouter =Backbone.Router.extend({
routes:{
"surveys":"list"
},
list:function(){
React.renderComponent(
<ListSurveys />,
document.querySelector('body')
);
}
});