以下是React实现的后端组件(click-demo.js),我希望在后端渲染的时候直接绑定onClick事件,避免在前端再次操作,代码如下varReact =require("react/addons");varClickItem =React.createClass({ onClick :function(){ console.log("Itemclicked~"); }, render:function(){ return( 点击这里输出console信息! ); }});module.exports=ClickItem;在路由器中,我通过React.createFactory以及renderToString将组件转化为字符串并渲染到页面中去,如下:varReact =require("react/addons");varClickDemo =React.createFactory(require("../components/click-demo"));exports.index =function(req,res){ vardemo =React.renderToString(ClickDemo()); res.render("index/index",{demo:demo});};页面上直接通过如下方式在输出内容:但是,问题是,在组件中绑定的onClick事件并没有生效:点击这里输出console信息! 是绑定的方式不对,还是本来就不支持这种事件绑定方式,望各位大神指点~
2 回答
开满天机
TA贡献1786条经验 获得超13个赞
后端只会生成HTMLString,所有浏览相关的操作是无法进行的。E.g.componentDidMount事件不会被触发。在后端生成HTMLString并Return回浏览器端时,要重新render一次,但注意这次render要保证有同样的State(如果你用Flux的话,就是Store里的data要一样)。在这次浏览器端的render中,会发生事件绑定。一般情况下,只需要对‘GET’进行服务器端渲染,'POST','PUT','DELETE'这些不太有必要,完全在客户端处理就行了
添加回答
举报
0/150
提交
取消