一種觀點爲2個或多個頁面（Backbone.js的）

-1

我有兩頁。其中之一是儀表板，具有很多功能。第二頁是共享儀表板 - 第一頁的簡單版本。儀表板包含數據庫的視圖（它可以包含許多其他信息，但這個問題與此有關）。你可以點擊過濾按鈕，模態窗口將被打開。所以，儀表板的簡單版本不具備這種可能性。我想添加它，但我不想從完整版的儀表板中複製+過去的代碼，因爲這部分的代碼大約有兩千行。我會添加一些原始碼例如：一種觀點爲2個或多個頁面（Backbone.js的）

DashboardView = SomeAnotherView.extend({ 
initialize: function() {...}, 
events: {...} // huge objects of jQuery events, 
render: function() {...}, 
... // 2k lines of functions for events 
});

如何使用另一個頁面對此有何看法？我試圖從該視圖調用一個函數：

DashboardView.prototype.filterClicked(event);

但在這種情況下event.curentTarget爲空（這是該功能必須的），我也試着發送「這個」，以獲取上下文，但它失敗了。 是否有Backbone.js的一種可能性，使用2+頁一個查看沒有任何巨大的拷貝/粘貼代碼？

來源

2017-08-22 Vlad Oleshko

骨幹觀點應當鬆散耦合組件。所以你可以有一個表視圖的視圖，作爲表格的頁面，簡單的菜單以及僅將其他視圖作爲其自身的一部分使用的儀表板。 –

我寫了一個[答案]（https://stackoverflow.com/a/40567785/1218980），它用一個路由器例子解釋了一個簡單的佈局概念。 –

此外，現在的問題是[太寬泛]（https://stackoverflow.com/help/closed-questions）。你基本上是問如何使用Backbone來構建一個單頁面的應用程序... –

理想的情況下，如果你有一個觀點的簡單版和完整版，你應該有一個「基本視圖」（簡單的），並完整版應該擴展基本視圖。

它會看起來像：

var SimpleDashbard = Backbone.view.extend({}); 
var Dashboard = SimpleDashbard.extend({});

這樣儀表盤將有來自SimpleDashbard訪問方法。

你的情況聽起來像你需要使用的方法從基本視圖擴展視圖。這不是一個好主意。理想的情況下，如果它的共享你應該將其移動到基本視圖/提取到一個實用方法或服務，當然這涉及重寫此方法是可重複使用

來源

2017-08-23 11:05:23

-1

如果您有共享大量的功能性的意見，你可以考慮使用同一個視圖類型，但實例化時打開它的一些配置。例如：

var DashboardView = Backbone.View.extend({ 
    initialize: function(options) { 
     this.allowFunctionX = (options && options.allowFunctionX); 
     this.allowFunctionY = (options && options.allowFunctionY); 
    }, 
    // etc 
    functionX: function() { 
     if (!this.allowFunctionX) { return; } 
     // do the function... 
    }, 
    functionY: function() { 
     if (!this.allowFunctionY) { return; } 
     // do the function... 
    }, 
});

然後在一個頁面上：

var firstDashView = new DashboardView({allowFunctionX: true});

，並在另一頁上：

var secondDashView = new DashboardView({allowFunctionY: true});

這可能會成爲不值得，如果功能發散太多（有可能有更好的配置方式，而不是傳入大量的布爾值！）。如果你的要求在你的兩頁上顯着不同，我覺得重複他們都需要的代碼並不是一個重大的罪過。

來源

2017-08-22 22:37:16 arbuthnott

謝謝。我會檢查它。這不是我的項目，我剛剛開始學習Backbone並解決了問題。 –

一種觀點爲2個或多個頁面（Backbone.js的）

回答

相關問題