在Marionette中从一个区域切换到另一个区域时,视图无法正确渲染

Switching from a region to another in Marionette, views are not rendered correctly

本文关键字:区域 视图 另一个 Marionette 一个      更新时间:2023-09-26

我正在使用Marionette,遇到以下问题。

我创建了一个包含两个不同区域的布局。在initialize上,布局在布局的两个区域中加载两个视图。说ViewAViewB。在ViewA中触发一个事件。该事件由布局消耗以进行切换,并注入其他两个视图。说ViewCViewD。无论何时执行切换,ViewCViewD都不具有我应用于它们的相同样式(还有css)。特别是,jQuery Mobile样式不适用。有什么建议吗?

这里有一些代码,其中注释突出了重要部分。

onConfirm : function() {        
        this.leftView =  new ViewC();
        this.rightView = new ViewD();
        this.leftRegion.show(this.leftView);                                                                        
        this.rightRegion.show(this.rightView);
        // FIX calling trigger('create') seems fix the problem. Why? Is this correct?
        this.$el.trigger('create');
    },
initialize : function() {
        // listen for event triggered from ViewA
        // e.g. GloabalAggregator.vent.trigger("ga:confirm");
        // where "ga:confirm" is a simple string
        GloabalAggregator.vent.on("ga:confirm" , this.onConfirm, this);  
        this.leftView =  new ViewA(), // creating here a new ViewC the style is applied correctly
        this.rightView = new ViewB(); // creating here a new ViewD the style is applied correctly
    },
onRender : function () {
        this.leftRegion.show(this.leftView);                                                                        
        this.rightRegion.show(this.rightView);
    }

编辑

调用trigger('create')似乎可以解决问题。为什么?这是正确的吗?

当您向页面添加新的html时(添加新的渲染视图、将视图交换为其他视图等),您必须让jQuery mobile知道这一点。

"create"事件用于通过jQueryMobile小部件增强"raw"html。更多信息可以在这里找到:http://jquerymobile.com/demos/1.0/docs/pages/page-scripting.html查找"增强新标记"部分。