0

Backbone.js/Require.js のアーキテクチャの問題を解決する最善の方法を見つけようとしています。

ここにテスト プロジェクトがあります: https://github.com/Integralist/Backbone-Playground

私が抱えている問題は、メイン スクリプト ファイルでビューを作成し、次に別のビュー スクリプト ファイルで他のビューにアクセスしようとしているが、グローバルを設定する以外にそれを行う方法がわからないことです。変数/プロパティ?

https://github.com/Integralist/Backbone-Playground/blob/master/Assets/Scripts/App/main.js#L73は、グローバルとhttps://github.com/Integralist/Backbone-を設定する場所ですPlayground/blob/master/Assets/Scripts/Views/Contacts.js#L34-35は、私がアクセスしている場所です。

他にアクセスする方法に頭を悩ませているようには見えません。

これは設定されている 1 つのグローバルにすぎないことはわかっています。そのように維持する必要がある場合は、グローバルの名前空間を次のように変更することで、損傷を制限することもできます。window.myapp.contact_view = new ContactView(...)しかし、これは、このタイプのスコープの問題に対する醜い回避策のように感じます。

アドバイスをいただければ幸いです。

更新: その後、Google の Addy Osmani がツイートして、グローバルの名前空間を変更することがこの場合にできる最善の方法であると提案しましたが、この質問はしばらく開いたままにして、他に提案があるかどうかを確認します。

4

3 に答える 3

0

これをContactsView.jsで試してください:

define([ 'backbone' ], 
function(B) {

  return B.View.extend({

    display_selected: function(event) {
      this.options.contactView.render(model);
    }

  })

})

あなたのコードでは、

new ContactsView({
  contactView: new ContactView( ... ) 
})

とにかく、おそらく、ContactsViewから挿入されたビューを作成し、必要な情報を追加のオプション値として渡す必要があります。

于 2012-08-14T17:32:44.433 に答える
0

教祖が話しました:) (Addy Osmani)

私見でできる/すべきことは次のとおりです-コードを自己実行機能ブロックでラップします:

ファイル1.js:

(function(myNameSpace){
 // do something
 myNameSpace.sharedValue = something();

})(window.myNameSpace = window.myNameSpace || {});

File2.js でまったく同じコード (構造) を繰り返します。

最後の行は、どちらのファイルが最初にロードされても、オブジェクトが作成され、同じオブジェクトがファイル間で使用されるようにします。myNameSpace同じ引数を関数に渡すと、関数自体のオブジェクトにアクセスできます。

他のファイルは、適切と思われるオブジェクトを拡張/拡張/使用できます。基本的に、グローバルを公開する以外に(ファイル間で)javascriptで変数を共有する方法はありませんが、良い方法で行うことができます:)

于 2012-08-13T22:39:42.433 に答える
0

Addy Osmani によって提案されたように、グローバル名前空間を使用することが最善の選択肢であると判断しましたが、別のオプションが必要な場合は、次のようにインスタンス固有のプロパティを設定するだけだと思います。

contacts_view.contact = new ContactView({
    el: $('#view-contact')
});

その後、その中からビューのrender()メソッドにアクセスできますcontacts_view...

var ContactsView = Backbone.View.extend({
    events: {
        'change select': 'display_selected'
    },

    display_selected: function (event) {
        this.contact.render(model);
    }
});

...これは、単一のグローバル名前空間オプションよりもクリーンに感じますが、複数の View をContactsView. なぜ複数のビューを結び付ける必要があるのか​​ わかりませんが、それでも混乱が発生する可能性があるため、単一のグローバル名前空間を持つことが最善の選択肢であると思います(今のところ)。

更新: View インスタンスを作成するときに追加のデータを渡すことができることに気付いたので、ここで行ったことです...

var contacts_view = new ContactsView({
    el: $('#view-contacts'),
    collection: contacts,
    associated_view: new ContactView({
        el: $('#view-contact'),
        collection: contacts
    })
});
于 2012-08-15T14:02:54.430 に答える