Question

美好的一天！我需要将模型的属性呈现给JSON，以便将它们传递给模板。

型号：

var UserInfo = Backbone.Model.extend({
url: appConfig.baseURL + "users/",
});

模板：

<script type="text/html" class="template" id="profile-form">
    <h2 class="ui-li-heading"><%= username %></h2>
    <p class="ui-li-desc"><strong><%= phone %></strong></p>
</script>

查看：

var ProfilePageView = Backbone.View.extend({
    events: {
        'click #edit': "edit"
    },

    initialize: function () {
        this.template = $.tpl['profile-form'];

        var user = new UserInfo()
        user.fetch({
            data: $.param({email: localStorage.getItem('user_email')}),
            type: 'POST'
        });

        console.log(user) //returns correct object with attrs
        console.log(user.toJSON()) //returns empty object
    },

    render: function (eventName) {
        $(this.el).html(this.template());
    },

    edit: function () {
        window.workspace.navigate('#account/edit', { trigger: true});
    }
});

当我输入类似这样的控制台时，user.toJSON()会返回正确的数据

var user = new UserInfo();
user.fetch({
        data: $.param({email: localStorage.getItem('user_email')}),
        type: 'POST'
});

但是当我把它放到我看来时，它会返回Object {}。错误在哪里或告诉我如何以json格式不同地传递给从服务器接收的模板数据？谢谢！

Answer 1

您似乎有两个问题。 fetch是异步的，因此您需要使用回调来使用该信息。但首先是关于toJSON的解释。 .toJSON()实际上不返回JSON字符串，它返回一个您想要JSON字符串化的对象。这允许您修改toJSON方法以自定义从模型或集合中获取的属性，并将其添加到模型的JSON字符串表示中。以下是the Backbone.js docs的引文：

toJSON collection.toJSON（[options]）

返回JSON模型属性的浅表副本   字串。这可以用于持久性，序列化或   在发送到服务器之前进行扩充。这个名字   方法有点混乱，因为它实际上不返回JSON字符串    - 但我担心这是JavaScript API的方式   JSON.stringify有效。

所以你应该在你的代码中替换这一行

console.log(user.toJSON())

这一个

console.log(JSON.stringify(user))

您看到的toJSON返回的对象将变为JSON。

现在，即使您这样做，也无法正常运行，因为在从console.log获取模型数据之前，您将执行fetch。 fetch是异步的，因此您需要在fetch回调中success完成后调用您要执行的任何代码：

    user.fetch({
        data: $.param({email: localStorage.getItem('user_email')}),
        type: 'POST',
        success: function(){
            console.log(user);
            console.log(JSON.stringify(user));
        }
    });

在.fetch（）之后，骨干模型.toJSON（）不起作用

1 个答案: