0

我正在学习 CoffeeScript 和 Backbone JS。我只想装载一件设备。是的，我知道我不需要 Backbone JS - 但如果我从基础开始学习，它会帮助我学习。页面加载后，我希望它从服务器获取一些 JSON，并将其显示在页面上。

到目前为止，这是我的咖啡脚本：

jQuery ->
    class Equipment extends Backbone.Model
        defaults:
            title:''
            desc:''
        url:'/getData'

    class ItemView extends Backbone.View
        tagName: 'div'

        initialize: ->
            _.bindAll @, 'render'

        render: ->  
            $(@el).html """
                <h1>#{@model.get 'title'}</h2>
                <p>#{@model.get 'desc'}</p>
            """
            @

    class AppRouter extends Backbone.Router.extend
        routes:
            '':'getData'

        getData: ->
            @equipment = new @Equipment()
            @equipmentView = new @ItemView
                model: @equipment
            @equipment.fetch()
            $('div').html @equipmentView.render().el

    appRouter = new AppRouter

    Backbone.history.start()

我觉得我已经准备好了所有的部分，并且没有出现任何错误（无论是在编译还是在运行页面时）。

我期望从服务器返回的基本 JSON 只是一个与此相呼应的 PHP 页面：

{
    "title": "title",
    "desc": "description"
}

我错过了什么？

4

2 回答 2

0

您必须告诉 Backbone 像这样路由您的初始 url ('')：

Backbone.history.start pushState: true

您还应该传递一个 id （我认为 Backbone 会/getData/undefined在您的情况下提出请求，并且在旁注中，我认为您应该使用咖啡的胖箭头而不是bindAll（这是咖啡脚本的众多优点之一，但是您应该摆脱一些@s 因为他们不再指代 window ...

于 2013-04-02T06:15:06.317 回答
0

@equipment.fetch() 甚至会触发 HTTP 请求吗？

据我了解，您必须设置 id:@equipment = new @Equipment(id:123)这将触发“/getData/123”请求。

或者在 fetch: 中指定 url@equipment.fetch(url:"/getData")来加载

但是视图仍然是空的，因为在执行视图 render() 时数据还没有加载。当模型更改时，Backbone 不会自动更新视图（就像 EmberJS 一样）。

添加@listenTo(@model, "change", @render)到初始化方法以在模型更改时重新渲染。

我为您找到了一个不错的指南/教程 http://adamjspooner.github.com/coffeescript-meet-backbonejs/

于 2013-04-01T16:30:33.937 回答