Ember 应用程序套件应用程序视图 didInsertElement 仅触发一次

Question

您好，我使用Ember app kit，每次更改路线时都需要触发didInsertElement（子视图-插座视图）。我需要全局应用 DOM 就绪事件之类的东西。

我找到了mavilein's solution，但它不起作用。

这是我的app/views/application.js：

export default Ember.View.extend({
   didInsertElement : function(){
      this._super();
      Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
   },
   afterRenderEvent : function(){
     // implement this hook in your own subclasses and run your jQuery logic there
     console.log("FIREEEEE");
  }   
});

当我运行应用程序时，它会触发didInsertElement，但是当我更改路由（点击链接）时，它不会触发应用程序视图didInsertElement 事件。

我知道应用程序视图不会改变，但我需要每次更改子视图时都会触发的东西。还是我在破坏架构并以其他方式做事？

感谢您的帮助。

Answer 1

嘿@petkopalko，您在 cmets 中说过您想将 Holder.js 用于占位符图像，就像您说的那样，由于 holder.js 的工作原理，您需要执行 Holder.run() 函数。您可以做的是在 didInsertElement 钩子中将 Holder.run() 添加到每个需要它的视图中，但这不是您想要做的，而且可能会让人厌烦。

现在从您上面的代码中，使用 Ember App Kit (EAK) 和解析器，我认为您实际上在做什么：

 export default Ember.View.extend({...

从app/views/application.js 内部实际上导出了与 ApplicationView 关联的视图，这就是为什么它只会执行一次，因为应用程序视图会在页面加载时插入。

我正在做一些黑客攻击，似乎有效的是您必须重新打开 Embers 视图类（对象）并将 holder.run 添加到 didInsertElement 挂钩中。在 EAK 中重新打开 Ember 基类对我来说最有效的方法是在 app.js 文件中进行。

app.js 文件中的内容如下所示：

 Ember.View.reopen({
   didInsertElement: function(){
     Ember.run.next(function(){
       Holder.run();
     }
   }
 });

它似乎只适用于 ember.run

 Ember.View.reopen({
   didInsertElement: function(){
     Ember.run(function(){
       Holder.run();
     }
   }
 });

如果您愿意，您可以保留之前的所有代码，只需将其放入 app.js

Ember.View.reopen({
  didInsertElement : function(){
    this._super();
    Ember.run.scheduleOnce('afterRender', this, this.afterRenderEvent);
 },
 afterRenderEvent : function(){
   // implement this hook in your own subclasses and run your jQuery logic there
   console.log("FIREEEEE");

   //You can place the holder.run() function here and not in views

   Holder.run();
 }

});

如果您没有在重新打开视图的 afterRenderEvent 函数中放置 Holder.run()。您必须将它放在您似乎想要的 afterRenderEvent 函数的视图中。

 SomeView = Ember.View.extend({
   afterRenderEvent: function() {
     this._super();
     Holder.run();      
   }
 }); 

不确定这些方法的副作用，但您可以在实施后进行探索。所以你有几个选择：快乐编码。

这里附上一个 jsbin，它似乎说明了我认为您正在寻找的行为：

http://emberjs.jsbin.com/medamata/6/edit