Question

所以我最终尝试了这些前端框架中的一个，我想我会选择backbone.js，因为它已经存在了一段时间并且已经证明了它的生产价值。

我正在我的localhost（XAMPP）上进行一些测试。我只是抓取一些JSON格式的数据并添加到集合中。由于这是我第一次这样做，我假设我做错了，但我的代码看起来像这样：

的index.php：

<html>
    <head>
        <title>Backbone Testing</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script src="js/underscore-min.js"></script>
        <script src="js/backbone-min.js"></script>
    </head>
    <body>
        <div id="container" style="margin-left: auto; margin-right: auto;"></div><br /><br />
    </body>

    <script src="mv/app.js"></script>

    <script>
        var test = new App();
    </script>
</html>

app.js：

/*
    Model
 */
var App = Backbone.Model.extend({
    initialize: function() {
        $.ajax({
            type: "POST",
            url: "getData.php",
            success: function(data) {
                var jData = JSON.parse(data);

                console.log(jData); // Data coming in is in proper format

                // After commenting out the lines below
                // it doesn't crash

                //var users = new Data;
                //users.reset(jData);
            },
            error: function(xhr) {
                console.log(xhr);
                alert("Error!");
            }
        });
    },

    defaults: {
        SURNAME: "",
        FST_NAME: ""
    }
});

/*
    Collection
 */
var Data = Backbone.Collection.extend({
    model: App,
});

我正在做的是从我的模拟数据库中提取一些数据并尝试将其添加到集合中，但是当它通过users.reset（jData）添加到集合中时我没有得到JavaScript错误但网页刚刚变为没有响应，不久之后我的服务器崩溃（XAMPP停止工作）。

任何帮助都会受到赞赏，因为我在这里查看了几个主题以及各种Google搜索，但无法找出我做错了什么。谢谢！

Answer 1

似乎崩溃的原因是重复的AJAX调用。调整app.js后现在看起来像：

$(function() {
    $.ajax({
            type: "POST",
            url: "getData.php",
            success: function(data) {
                var jData = JSON.parse(data);

                var users = new Data;
                users.set(jData);
            },
            error: function(xhr) {
                console.log(xhr);
                alert("Error!");
            }
        });
});

/*
    Model
 */
var App = Backbone.Model.extend({
    defaults: {
        SURNAME: "",
        FST_NAME: ""
    }
});

/*
    Collection
 */
var Data = Backbone.Collection.extend({
    model: App,
});

现在我只需要弄清楚如何渲染视图并且我会很好，但我想这是另一篇文章。

骨干崩溃XAMPP

1 个答案: