2015-07-21 105 views
0

我有這個代碼是與node-jsx編譯服務器端,但點擊事件不會觸發。作爲新手,我想不出什麼我錯過了ReactJS服務器端渲染點擊事件不會觸發

/** @jsx React.DOM */ 

var React = require('react/addons') 
var mui = require('material-ui'); 
var ThemeManager = new mui.Styles.ThemeManager(); 
var injectTapEventPlugin = require("react-tap-event-plugin"); 

var UnyDentApp = React.createClass({ 

    childContextTypes: { 
    muiTheme: React.PropTypes.object 
     }, 

    getChildContext: function() { 
     return { 
      muiTheme: ThemeManager.getCurrentTheme() 
     }; 
     }, 

    componentDidMount: function() { 

     }, 

    render: function() { 
     var menuItems = [ 
      { route: 'home', text: 'Home' }, 
      { route: 'about', text: 'About' }, 
     ]; 

     return (
      <div id="uny-dent"> 
      <mui.LeftNav 
       ref='leftNav' 
       menuItems={menuItems} 
       docked={false} /> 
      <mui.AppBar 
       title="UnyDent" onMenuIconButtonTouchTap={ this._handleClick }/> 
      </div> 
     ) 
     }, 

    _handleClick: function() 
     { 
     alert('ok'); 
     }, 

    toggleNav: function(e){ 
     e.preventDefault(); 
     alert(); 
     this.refs.leftNav.toggle(); 
     } 
    }); 

/* Module.exports instead of normal dom mounting */ 
module.exports = UnyDentApp; 
+0

可能將處理程序綁定到事件。 – Amit

+0

對不起,我錯過了事件處理程序,但在我的代碼片段中,但現狀是相同的 – fefe

回答

1

它看起來就像你正在試圖做的是通常被稱爲「同形響應」。這與簡單地呈現反應模板服務器端(導致呈現爲靜態頁)的不同之處在於,它還支持「裝載」反應組件客戶端(導致呈現的動態頁面)。

現在你只是在做前者,因此React實際上並沒有運行客戶端,所以點擊事件實際上並沒有「連線」。同構反應有幾種不同的解決方案。以下是Paypal團隊中的一個特別之處:https://github.com/paypal/react-engine

+0

感謝您的反饋我會檢查它的細節 – fefe

相關問題