0

我无法用 Reactjs 服务器端呈现我的语义。它没有语义,因此我的反应服务器端代码没有问题。服务器崩溃并给出错误的开始行:

/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

我用 npm 安装了 jquery。最后还尝试安装jsdom版本jsdom@3.1.2。没有工作。

我在语义 ui 网页中使用Recipes-Server-side 渲染。

我用于服务器端组件的代码如下:

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 进行服务器端渲染的普遍已知问题,还是我做错了?

4

1 回答 1

0

尝试这个:

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

我认为调用require('semantic-ui-dropdown')需要window在 DOM 中初始化现有的

require('semantic-ui-dropdown') 并从文件顶部删除实际

于 2016-06-21T14:19:19.013 回答