Question

这应该是关于backbone.js的一个非常基本的问题，我是javascript / backbone.js的完全初学者，我已经阅读了几个教程，但我没有设法做一个相当简单的任务：“获取一个列表来自数据库的条目“。

整个应用程序都在Google App Engine上。数据库已经包含几个条目“单词”，我使用Flask发送条目的JSON表示。

这是我用于此任务的功能：

@wordbook.route('/words', methods=('GET', 'POST'))
def wordlist():
    return retrieve_words()


def retrieve_words():
    content = json.dumps([word.to_dict() for word in Word.all()])
    response = make_response(content)
    response.mimetype = 'application/json'
    return response

因此，据我了解程序的工作方式，我的骨干应用程序将位于网站的根目录，他会询问“/ words”URL以某种格式从数据库中获取一些数据称为JSON，以便应用程序可以自由使用它。

我认为URL http://localhost:8080/words是正确的，因为输出如下：

[{"word": "keyboard", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGAEM", "language": "en", "nature": "noun", "usage": "Plural keyboards", "gender": ""}, {"word": "keyboard", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGBoM", "language": "en", "nature": "verb", "usage": "Regular verb", "gender": ""}, {"word": " mouse", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGB4M", "language": "en", "nature": "noun", "usage": "Plural  mousemice", "gender": ""}, {"word": " mouse", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGDIM", "language": "en", "nature": "verb", "usage": "Regular verb", "gender": ""}, {"word": " hard", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGDoM", "language": "en", "nature": "adj", "usage": "Comparative  harder, superlative  hardest", "gender": ""}...]

在网站的根目录，我有一个空白的网页（我想先从非常简单的任务开始），一个简单的javascript文件（以及依赖项，json2，jQuery，下划线和主干）。

我是javascript的初学者，所以我使用Coffeescript，因为语法与我在python中实际知道的相似，所以我认为学习曲线不会那么陡峭。这是我的咖啡文件：

class Word extends Backbone.Model

class WordList extends Backbone.Collection
    model: Word
    url: 'words'

Words = new WordList

class WordView extends Backbone.View
    tagName: 'p'
    render: ->
      word = @model.get 'word'
      $(@el).html word
      @

class WordListView extends Backbone.View        
    el: $ 'body'
    initialize: ->
      _.bindAll @, 'addOne', 'addAll'
      Words.bind 'add',     @addOne
      Words.bind 'refresh', @addAll
      Words.fetch()

    addOne: (word) ->  
      view = new WordView model: word
      @.$ 'body'.append view.render().el

    addAll: ->
      Words.each @addOne    
->  WordList = new WordListView

总结一下我在这里写的内容，我创建了一个名为Word的模型，以及一个包含所有单词的集合。此集合应使用JSON URL从服务器获取所有数据。每个单词都可以使用自己的特定视图（WordView）在段落p中呈现。在应用程序视图（WordListView）中，我只是将add动作绑定到addOne函数，以及addAll函数的刷新动作。我试着在这个时候取出所有的单词。 addOne函数创建相应单词的新视图，并向主体追加应包含单词的新段落。每次添加新单词时，绑定都会触发addOne函数，呈现每个单词。

我不知道我是否有正确的思考方式。

Answer 1

如果我正确理解了您的问题，那么您在尝试了解运行Words时未填充Words.fetch()的原因。我有几个问题要问你：

WordList.url的价值是多少？对于您的示例，它应该是"/words"。
fetch method接受success和error回调...

这意味着您可以按如下方式进行调试（假设您的浏览器具有开发人员控制台）：

Words.fetch
  success: (collection, response) -> console.log "success: #{response}"
  failure: (collection, response) -> console.log "failure: #{response}"

当你这样做时，你在控制台中看到了什么？

获取一个简单的条目列表

1 个答案: