javascript - ReactJS 无法在 IE11 中呈现

Question

我的网站在 Web 浏览器中完美运行，但 IE11 在控制台中显示此错误。

我该怎么办？

React.render(
    <NewsFeed tagFilter={tagFilter}/>,
    document.getElementById('newsFeed')
);

'NewsFeed' 未定义

编辑： 这是新闻源（.js JSX 文件，包含在页面标题中）

var Article = React.createClass({
    askDelete: function(id,title) {
        if (confirm("Delete the '"+title+"'?")) {
            $.ajax({
                url: "/-----removed----/"+id,
                type: "DELETE",
                async: false,
                cache: false,
                dataType: 'json'
            });
            location.reload();
        }
    },
    handleClick: function(id) {
        React.unmountComponentAtNode(document.getElementById('editor'));

        React.render(
                <PostEditor
                    postId={id}
                />,
                document.getElementById('editor')
            );
        functAdmin.showEditor();
    },
    render: function() {
        var editIcon=[];
        var boundClick = this.handleClick.bind(this, this.props.id);
        var boundDeleteClick = this.askDelete.bind(this, this.props.id,this.props.title);
        editIcon.push(<span className="adminActionsNewsfeed" key={"editIcon"+this.props.id}><i className="pointer gray fa fa-edit" onClick={boundClick}></i><i className="pointer fa fa-remove red" onClick={boundDeleteClick} key={"deleteNewsIcon"+this.props.id}></i></span>);
        var tags=[];
        if (typeof this.props.tags != 'undefined') {
            var tagArray=this.props.tags.split(",");
            for(tag of tagArray){
                tags.push(<a href={"?tag="+tag} className="postTag">{tag}</a>);
            }
        }
        return (
            <div className="article" key={"newsArticle"+this.props.id}>
                {editIcon}
                <span className="articleTitle">
                    {this.props.title}
                </span>
                <span className="articleTime">
                    {funct.formatDate(this.props.time)}
                </span>
                <div className="articleBody">
                    {this.props.children}
                </div>
                <div className="tagLine">{tags}</div>
            </div>
        );
    }
});

var ArticleList = React.createClass({
    render: function() {
        this.props.data.sort(funct.SortByTime);
        var postNodes = this.props.data.map(function (item) {
            var tags = item.news_tags.toLowerCase().split(",");
            if ((tagFilter=="") || (tags.indexOf(tagFilter) > -1)) {
                return (
                    <Article
                        key={"news"+item.news_id}
                        title={item.news_title}
                        tags={item.news_tags}
                        time={item.news_time}
                        id={item.news_id}
                    >
                    {item.news_body}
                    </Article>
                );
            }
        });
        return (
            <span>
                {postNodes}
            </span>
        );
    }
});

var NewsFeed = React.createClass({
    launchAdd: function() {
        React.unmountComponentAtNode(document.getElementById('editor'));
        React.render(
                <PostEditor
                    postId={""}
                />,
                document.getElementById('editor')
            );
        functAdmin.showEditor();
    },
    getInitialState: function() {
        return {data: []};
    },
    refreshPostStatus: function() {
        $.ajax({
            url: "/-----removed----",
            type: "GET",
            cache: false,
            dataType: 'json',
            success: function(data) {
                this.setState({data: data});
            }.bind(this),
            error: function(xhr, status, err) {
                console.log( xhr.responseText);
                console.error(this.props.url, status, err.toString());
            }.bind(this)
        });
    },
    componentDidMount: function() {
        this.refreshPostStatus();
    },
    render: function() {
        var addIcon=[];
        addIcon.push(<div className="addPostLine"><i className={funct.statusIcon[5]+" fa-2x"} onClick={this.launchAdd} />Add new post</div>);
        return (
            <span>
                <i className="fa fa-file fa-lg blue"></i>
                {addIcon}
                <h1>Netbiter funct System Information</h1>
                <ArticleList data={this.state.data}/>
            </span>
        );
    }
});

Answer 1

解决了。IE11 不喜欢 newsfeed.js 的这一部分：

for(tag of tagArray){
                tags.push(<a href={"?tag="+tag} className="postTag">{tag}</a>);
            }

用这个替换它后它可以工作：

for(var i in tagArray){
    var tag=tagArray[i];
    tags.push(<a href={"?tag="+tag} className="postTag">{tag}</a>);
}

Answer 2

只需将“core-js/es6/”导入您的 index.js 或主条目文件

import 'core-js/es6/';

import React from 'react';
import ReactDOM from 'react-dom';
import App from './app';

ReactDOM.render(<App />, document.getElementById('root'));