1

我在正文中附加了一个模板，这在 jquery mobile 中表现良好。但是，然后我遍历数据并呈现单个视图-jquery mobile 现在失败了。

最初我使用 listview("refresh")，但是当循环一个全新的视图时，我得到了这个错误，“ jquerymobile 错误“cannot call methods on listview before initialization ”……同时实现 trigger("create") 也没有无论我把它放在哪里似乎都不起作用......也许我错了，如果是的话，你能告诉我把它放在哪里，或者解释如何解决这个问题......

另一个问题建议这样做......但我不确定将它放在哪里，以及它是否有效：

$('#myListview').bind('pageinit', function() {
  $('#myListview').listview('refresh');
});

我真的被困住了..任何人都可以阐明如何解决这个问题，谢谢！

我循环通过较小视图的主要视图是.. 

class FavouritesListView extends Backbone.View
    initialize: =>
        Favourites.fetch()

    template: _.template($('#propertyFavourites').html())

    render: =>
        $(@el).append(@template)
        @addFavs()

    addFavs: =>
        Favourites.each (fav) =>
            view = new FavouriteView({model: fav})
            $("#favList", @el).append(view.render().el)

            #I've tried $("#favList", @el).append(view.render().el).listview("refresh") & get "cannot call methods on listview prior to initialization".. I've also tried .trigger("create") which doesn't work..

我的列表项视图是（正在呈现没有样式）...

class FavouriteView extends Backbone.View
    template: _.template($('#propertyFav').html())

    render: =>
        $(@el).html(@template({row: @model}))
        @

我的路由器和应用程序是这样加载的..

class AppRouter extends Backbone.Router
    routes:
        "": "home"
        "favourites": "favourites"

    initialize: ->
        #handle back buttons
        $('.back').live('click', (event) -> 
            window.history.back();
            false
        )
        @firstPage = true;

    home: ->
        @changePage(new HomeView())

    favourites: ->
        @changePage(new FavouritesListView())

    changePage: (page, theTransition) ->
        $(page.el).attr('data-role', 'page')
        page.render()
        $('body').append($(page.el))

        if theTransition is undefined
            transition = $.mobile.defaultPageTransition
        else
            transition = theTransition

        #We don't want the first page to slide in
        if @firstPage
            transition = 'none'
            @firstPage = false

        $.mobile.changePage($(page.el), {changeHash: false, transition: transition})


$(document).ready( ->
    AppRouter = new AppRouter()
    Backbone.history.start()
)

作为参考，我正在使用 jqm 1.2.0 Alpha ...

任何帮助将不胜感激，谢谢

4

1 回答 1

1

我认为您listview每次render在FavouritesListView. 每次你创建一个新的<ul>，你都必须重新触发create它。理想情况下，您会保留该ul元素，并且仅在完成后换掉内部li元素fetch。然后$('#favList').listview('refresh')在他们被困在那里的时候做。

但是，这将需要一些重大的返工，因此，请尝试使用您现有的代码：

class FavouritesListView extends Backbone.View
    initialize: =>
        Favourites.fetch()

    template: _.template($('#propertyFavourites').html())

    render: =>
        @$el.append(@template)
        @addFavs()

    addFavs: =>
        # FYI: @$(...) is shorthand for this.$el.find(...)
        $favList = @$("#favList")
        Favourites.each (fav) =>
            view = new FavouriteView({model: fav})

            # TODO: batch these up and only do one append at the end for better performance.
            $favList.append(view.render().el)

        # Move this trigger out of the for loop, only trigger at the end.
        # Sometimes triggering create on the parent is better, not the actual list.
        @$el.trigger "create"

我还根据一些新的 Backbone 功能调整了一些东西this.$el === $(this.el)，this.$(...) === this.$el.find(...)例如更好用的等效速记。

于 2012-09-26T21:10:04.263 回答