Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/470.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 为什么下面的代码抛出“uncaughttypeerror:inst.render不是函数”,而我正在使用React JS?_Javascript_Jquery_Ajax_Reactjs - Fatal编程技术网

Javascript 为什么下面的代码抛出“uncaughttypeerror:inst.render不是函数”,而我正在使用React JS?

Javascript 为什么下面的代码抛出“uncaughttypeerror:inst.render不是函数”,而我正在使用React JS?,javascript,jquery,ajax,reactjs,Javascript,Jquery,Ajax,Reactjs,错误未捕获类型错误:inst.render不是指向行号的函数 function RenderComment(){ alert("Clicked"); ReactDOM.render(React.createElement("div", {}, React.createElement(Comment,{})), //the error points to this line doc

错误未捕获类型错误:inst.render不是指向行号的函数

function RenderComment(){
                alert("Clicked");

                ReactDOM.render(React.createElement("div", {}, React.createElement(Comment,{})),   //the error points to this line
                        document.getElementById('content')
                );      
            } 
我也收到了一个警告

警告:注释…:在返回的组件实例上找不到呈现方法:您可能忘记定义呈现、从无状态组件返回null/false,或者试图呈现类型为非React组件的函数的元素

我的整个代码

   <script type="text/babel">

    var CommentBox = React.createClass({
        var token = $("meta[name='_csrf']").attr("content");
        var header = $("meta[name='_csrf_header']").attr("content");
        var initializeScroll = 0;
        loadCommentsFromServer: function() {
            initializeScroll = initializeScroll + 5;
            var data = {
                "count": initializeScroll
            };
            $.ajax({
                url: this.props.url,
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataType: 'json',
                data: JSON.stringify(data),
                cache: false,
                beforeSend: function(xhr) {
                    xhr.setRequestHeader(header, token);
                },
                success: function(result) {
                    this.setState({
                        data: this.state.data.concat(result)
                    });
                }.bind(this),
                error: function(xhr, status, err) {
                    console.error(this.props.url, status, err.toString());
                }.bind(this)

            });
        },
        getInitialState: function() {
            window.addEventListener("scroll", this.handleScroll);
            return {
                loadingFlag: false,
                data: []
            };
        },
        componentDidMount: function() {
            this.loadCommentsFromServer();
        },
        handleScroll: function(e) {
            //this function will be triggered if user scrolls
            var windowHeight = $(window).height();
            var inHeight = window.innerHeight;
            var scrollT = $(window).scrollTop();
            var totalScrolled = scrollT + inHeight;
            alert("Heeeeey");
            if (totalScrolled + 100 > windowHeight) { //user reached at bottom
                if (!this.state.loadingFlag) { //to avoid multiple request 
                    this.setState({
                        loadingFlag: true,
                    });
                    loading("on");
                    this.loadCommentsFromServer();
                }
            }
        },

        render: function() {
            return ( < div className = "commentBox" >
                < CommentList data = {
                    this.state.data
                }
                /> < /div>

            );
        }
    });

    var CommentList = React.createClass({
        render: function() {
            var commentNodes = this.props.data.map(function(comment) {
                return ( < Comment > {
                        comment
                    } < /Comment>

                );
            });
            return ( < div className = "commentList" > {
                commentNodes
            } < /div>);
        }
    });

    var Comment = React.createClass({
        rawMarkup: function() {
            var rawMarkup = marked(this.props.children.toString(), {
                sanitize: true
            });
            return {
                __html: rawMarkup
            };
        },
        render: function() {
            return ( < div className = "comment" >
                < span dangerouslySetInnerHTML = {
                    this.rawMarkup()
                }
                /> < /div>
            )
        }
    });


    ReactDOM.render( < CommentBox url = "/myUrl/abcd" / > ,
        document.getElementById('content')
    );

    <script>
我想做的是,滚动一个网页无限滚动并从服务器加载内容——AJAX+JQuery for infinite scroll+React JS。
请帮帮我。我花了整个周末

这些var标记=$meta[name=''u csrf'].attrcontent;行不是有效的代码。对象中不能有这样的声明。你能试着在某个地方建立一个在线示例吗?更容易调试。另外,考虑一下捆绑你个人开发的集束器。Webpack很受用户欢迎。您还可以在附近找到基于Browserify的设置。