0

我已经更新了我的问题，请查看更新的部分：

我正在使用rails-backbone geminrails 4并且我遵循了 github 的 gem 页面上提供的一个简单示例。Backbone.js 现在工作正常，但是当我按下浏览器后退按钮返回查看我的所有帖子列表时，什么也没有显示。当我按下脚手架生成的返回链接时，它工作正常。我将编写以下步骤：

rails new demo34
// Edit your Gemfile and add

gem 'rails-backbone'
// Install the gem and generate scaffolding.

bundle install
rails g backbone:install
rails g scaffold User title:string content:string
rails g backbone:scaffold User title:string content:string
rake db:migrate

在我app/views/users/index.html.erb的内容如下：

<div id="users"></div>

<script type="text/javascript">
  $(function() {
    // Blog is the app name
    window.router = new Demo34.Routers.UsersRouter({users: <%= @users.to_json.html_safe -%>});
    Backbone.history.start();
  });
</script>

Backbone.js 现在工作正常，但是当我按下browser back button返回查看我的所有列表posts时nothing is displayed。当我按下back由scaffold.

我的 users_router.js.coffee 如下：

class Demo34.Routers.UsersRouter extends Backbone.Router
  initialize: (options) ->
    @users = new Demo34.Collections.UsersCollection()
    @users.reset options.users

  routes:
    "new"      : "newUser"
    "index"    : "index"
     ":id/edit" : "edit"
      ":id"      : "show"
    ".*"        : "index"

  newUser: ->
    @view = new Demo34.Views.Users.NewView(collection: @users)
    $("#users").html(@view.render().el)

  index: ->
    @view = new Demo34.Views.Users.IndexView(users: @users)
    $("#users").html(@view.render().el)

  show: (id) ->
    user = @users.get(id)

    @view = new Demo34.Views.Users.ShowView(model: user)
    $("#users").html(@view.render().el)

  edit: (id) ->
    user = @users.get(id)

    @view = new Demo34.Views.Users.EditView(model: user)
    $("#users").html(@view.render().el)

更新：

使用下面的代码，我让它为骨干网和 turbolinks 的页面更改事件的后退按钮工作。现在按下后退按钮时，我的主干文本不会消失。但是页面加载事件也存在问题让我用一个例子来解释一下我的代码下面的意思：

 $(document).on ('page:change', function(){

    Backbone.history.stop();
     Backbone.history.start();
     });

我执行以下操作：

  1. localhost:3000（欢迎加入，您正在使用 ruby​​ on rails 页面出现）

  2. localhost:3000/posts（主干触发其index.jst.ejs模板）

  3. 单击new post然后将更改路由到localhost:3000/posts#/new( new.jst.ejs)

  4. 单击create post按钮，然后将更改路由到localhost:3000/posts#/id(`show.jst.ejs')

  5. 现在点击browsers back button路线更改为localhost:3000/posts#/new( new.jst.ejs)

  6. 再次单击后退按钮将我带到localhost:3000/posts( index.jst.ejs)

    在这里我可以看到新条目已成功输入。

  7. 再次单击后退按钮将我带到localhost:3000通过重新加载。

  8. 点击forward button返回 localhost:3000/posts( index.jst.ejs) 我仍然可以看到我的条目。

  9. 现在，如果我销毁我的条目并返回localhost:3000并返回，我们将看到条目没有被销毁。

4

0 回答 0