6

Backbone.js を使用したアプリケーションの編成に関するチュートリアルや情報がたくさんあることは知っています。それらのチュートリアルの助けを借りて、徐々に作成しています。ルーターの概念を理解していないようです。まあ、私はルーターが出発点であることを認識しており（そしてアプリの状態を伝えます）、そこにロジックを追加しない方がよいでしょう。

ルーターが1台あります。私のアプリは、最初にヘッダー、フッター、およびページのメイン部分を読み込みます。主要部分では、まず、ユーザーをログインする必要があります。ログインページをロードするには、次のようにします。

       var AppRouter = Backbone.Router.extend({
            initialize : function() {
            var headerView = new HeaderView({el:$('#header')});
            headerView.render;

            var footerView = new FooterView({el:$('#footer')});
            footerView.render;

            var loginView = new LoginView({el:$('#login')});
            loginView.render;
        },
        routes : {
            "inbox" : "inbox",
            "sentbox : "sentbox"
        },
        inbox : function() {
            // ...
        },
        sentbox : function() {
            // ...
        }
    });
    app = new AppRouter();
    Backbone.history.start();

ログインに成功すると、メールページが読み込まれます。MailView には、受信ボックス、送信ボックスなどを表示するイベントがいくつかあります。

     events: {
        "click .inbox": "showInbox",
        "click .sentbox": "showSentbox",
      },
       showInbox : function() {
            // app.route() or app.inbox() - ?
      }

この時点で、ルーターに../#inboxと を../#sentboxそれぞれ表示させたいと思います。アドレスバーにそれを表示するルーターのメソッドの1つをここで呼び出す必要があるかどうか疑問に思っています。私が混乱しているのは、1 つのルーターを使用する方が複数のルーターを使用するよりも優れていると言われているためです。もしそうなら、私AppRouterはより複雑になります。もう 1 つの問題は、ユーザーがアドレスを直接入力した場合、そのページを読み込む必要があることです。ロジックをAppRouter内に配置する必要があると思います。

ここで正しいアプローチを教えてください。よろしくお願いします！

4

3 に答える 3

12

Router.navigate() を確認してください ( http://documentcloud.github.com/backbone/#Router-navigate )

通常、ルーターのインスタンス変数を App オブジェクト内に保存します。

var App = {
  Views: {},
  Routers: {},
  Models: {},
  data: {}

  initialize: function() {
    this.data.mainRouter = new App.Routers.MainRouter();
  }
};

App.MainRouter は次のように定義されます。

App.Routers.MainRouter = Backbone.Router.extend({

   routes: {
     'route1' : 'route1handler',
     'route2/:param' : 'route2handler'
   },

   ... 
});

次に、新しいルートに移動したい場合は、ビュー内で次のように呼び出します。

App.data.mainRouter.navigate('route2/param1');
于 2013-03-13T09:22:57.213 に答える
7

次の方法でブラウザを適切なルートに送信するだけです。

location.href = "#/the_route_you_want";

内のリスナーがイベントBackbone.historyをキャプチャし、適切なビューが表示されます。hashChange

これは、HTMLを介して非常に簡単な方法で実行できます。

<a href="#/the_route_you_want">The Route You Want</a>

さらに読むために。

于 2013-03-13T05:29:01.267 に答える