使用React.js進行服務器端渲染

我無法設法使用Reactjs服務器端渲染我的語義。它的工作沒有語義，因此我的反應服務器端代碼沒有問題。服務器崩潰，並給出錯誤的開始行：使用React.js進行服務器端渲染

/Users/isik/Dev/portfolio/reactjs-server-side-rendering/node_modules/semantic-ui-dropdown/index.js:3443 
})(require("jquery"), window, document); 
        ^

ReferenceError: window is not defined

我的jQuery與NPM insatlled。最後還嘗試安裝jsdom版本[email protected]。沒有工作。

我在semantic-ui網頁中使用Recipes-Server-side rendering。

我用我的服務器端組件的代碼如下：

var React = require('react'); 
var jquery = require('jquery'); 
var dropdown = require('semantic-ui-dropdown'); 

// Can use JSX too 
var Component = React.createClass({ 
    componentDidMount: function() { 
     $('.ui.dropdown').dropdown(); 
    }, 
    componentDidUpdate: function() { 
     $('.ui.dropdown').dropdown('refresh'); 
    }, 
    render: function(){ 
     return(
       <div className="ui selection dropdown"> 
        <input type="hidden" name="gender"/> 
        <i className="dropdown icon"></i> 
        <div className="default text">Gender</div> 
        <div className="menu"> 
         <div className="item" data-value="1">Male</div> 
         <div className="item" data-value="0">Female</div> 
        </div> 
       </div> 
     ); 
    } 
}); 

module.exports.Component = Component;

那是一個普通已知的問題與服務器端與語義的UI渲染或我做錯了？

來源

2016-06-21 Işık

試試這個：

componentDidMount: function() { 
    var dropdown = require('semantic-ui-dropdown'); 
    $('.ui.dropdown').dropdown(); 
},

我認爲調用require('semantic-ui-dropdown')要求必須在DOM

初始化現有window從你的文件

來源

2016-06-21 14:19:19

意志事業的頂部去除實際require('semantic-ui-dropdown')與客戶端的衝突？客戶端有一個完整的語義UI，客戶端組件使用它，並且服務器端呈現的組件可以使用它，因爲我已經檢查過它。 –

也許吧。我不能說。這取決於使用它的是什麼。它可以覆蓋現有的客戶端「semantic-ui」定義。可能是github帖子會給出更多答案，爲什麼它不起作用:) –

1234567891011 :) –

使用React.js進行服務器端渲染

回答

相關問題