javascript - 销毁视图并重新加载相同的视图

Question

我遇到了一个问题，我需要在我的视图中完全销毁和删除一个组件，因为组件中的第 3 方项目需要完整的页面刷新才能正常运行。仅当父视图更改为完全不同的视图或刷新页面时，组件才会更新。是否可以从父视图中完全删除 ember 组件，然后使用父视图中新更新的模型信息重新渲染它？

App.VideoPlayerComponent = Em.Component.extend({
      initPlayer: function(){
            //player stuff here 
            //updates video url yet previous video DOM garbage remains
      }.observes('url'),

      didInsertElement: function(){
            this.initPlayer();
      }
});

我使用的视频播放器是平台 js PDK，它似乎仅适用于静态网站 >：

Answer 1

您可以使用this.rerender();

它将重绘当前视图/组件。另请注意，willDestroy()也会被调用。

在这里了解更多

更新 1

你必须使用这样的东西来找到你想要附加插件的元素

this.$().find("#my-video-element");

您还必须定义代码来销毁willDestroy挂钩中的视频播放器元素。这将确保在重新渲染时删除视频播放器。

App.VideoPlayerComponent = Em.Component.extend({
      initPlayer: function(){
            //player stuff here 
            //updates video url yet previous video DOM garbage remains
      }.observes('url'),

      didInsertElement: function(){
            this.initPlayer();
      },

      willDestroyElement : function(){
           //here you need code that video plugin provide to destroy the video attached
           this.$().find("#my-video-element").destory("video")  
      }

});