Ember組件可以偵聽路由的didTransition操作嗎？

我有一個Ember.Component包裝了一個js網格佈局算法。它在重新加載時運行良好，但不會響應路由轉換。假設我從項目1轉換到項目2我希望組件重新佈置網格。Ember組件可以偵聽路由的didTransition操作嗎？

didInsertElement: function() { 
    this._super(); 
    Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent); 
}, 
afterRenderEvent: function() { 
    //re-layout grid 
}

如何響應路由的didTransition操作？我應該如何做到這一點？

來源

2015-09-03 tillerstarr

你傳遞給組件的是什麼？如果你傳遞模型，你可以觀察'model.id'並相應地做你的事情。 –

沒有組件不能偵聽路由的didTransition事件，至少不要使用Ember開箱即用。你可以建立一些pub-sub系統，但我建議不要這樣做。

要解決您面臨的問題，您需要找到一種方法，使組件僅使用傳遞給它的數據來完成所需的工作。一般流程是，在轉換時，控制器將接收新模型並更新其狀態，然後將該狀態傳遞給組件，然後相應地更新其自身。您的組件的可視化顯示應該僅基於傳入其中的屬性，並且應該在這些屬性更改時相應更新。如果您發現自己不得不通過其他方式更新您的組件，那麼您的代碼可能會過於耦合。

來源

2015-09-03 19:32:36 GJK

另外，如果您在以這種方式設計組件時遇到困難，請隨時發佈一個新問題，向我們提供一些更多詳細信息。這絕對不是一個容易解決的問題。 – GJK

我的理解是組件緊密耦合，通常這不是問題。但是，在這種特定情況下，只需知道路由已經轉換，以便可以發生css佈局傳遞就可以了。 – tillerstarr

沒有使用私有API，在Ember中根本沒有辦法做到這一點。如果你絕對必須把這個信息傳遞給組件，我會推薦使用pub-sub系統，就像我在我的答案中所說的那樣。 – GJK

你也許可以做這樣的事情（測試與Ember 2.9.1工程）：

export default Ember.Component.extend({ 
    router: Ember.inject.service('-routing'), 

    didInsertElement() { 
    Ember.run.scheduleOnce('afterRender', this, function() { 
     this.get('router').on('didTransition', function() { 
     // didTransition 
     }); 
    }); 
    } 
})

您還需要創建一個初始化中注入進入路由器組件：

export default { 
    name: 'component-router-injector', 
    initialize: function(application) { 
    application.inject('component', 'router', 'router:main'); 
    } 
}

來源

2016-11-18 00:08:08 Martin

Ember組件可以偵聽路由的didTransition操作嗎？

回答

相關問題