使用 EXTJS 将值从视图发送到另一个视图答案

【问题标题】：Sending values from a view to another using EXTJS使用 EXTJS 将值从视图发送到另一个视图
【发布时间】：2014-02-06 11:35:34
【问题描述】：

我正在使用 EXT 4.2.0。

我有 2 个视图：视图 1 和视图 2。

在视图 1 中，我有一个 Ext.grid.Panel，它（在他的关联控制器中）包含一个 selectionchange 事件 lisetner。

selectionchange 被触发后，我进入视图 2，其中有一个表单。我需要从视图 1 控制视图 2 的来源。

我的意思是控制发送值，禁用按钮...

有关发送值问题的信息，我已经尝试过

Ext.getCmp('view2ID').getForm().loadRecord(this.getMyVar());

但这似乎不起作用，我不知道为什么！请问你能帮帮我吗？ :)

【问题讨论】：

为了更清楚，您是否在选择更改时创建表单（yourView2）？
我不知道为什么它在你的情况下不起作用，但你描述的场景似乎很基本。有一个由视图 1 上的事件调用的控制器方法，用于修改视图 2。
“创造”到底是什么意思？
我想我确实明白你所说的“创造”是什么意思。实际上，在加载 View2 的其他控制器（在我的情况下为 coled main）中有其他方法
我的意思是说你是在选择更改事件上创建你的类（View2）的新实例。但无论如何我认为你可以使用配置属性：docs.sencha.com/extjs/4.2.0/#!/api/Ext.Class-cfg-config

标签： extjs extjs4 extjs4.1 extjs4.2 extjs-mvc

【解决方案1】：

选项 1：正如@Lorenz 所说，调用控制器中的方法

selectionchange:function( record, selected, eOpts ){
     //getController
   controller = globalVar.getController('Controller');
   controller.onSelectionChangeEvent(record);
}

Option2 : 您可以在创建实例时将配置对象传递给 View2 在 view1 中，提及配置属性；

 //View 1....
 config :{
       recordObj : ''
   },
  .........
 selectionchange:function( record, selected, eOpts ){
     var form = Ext.create('My.view.Form',{recordObj :record});
 }
 ............

//Your View2 might be like 
Ext.define('My.view.Form', {
extend      : 'Ext.form.Panel',

   config :{
       recordObj : ''
   },

  initComponent : function() {
   var record = this.getRecordObj(); 
   this.items = [

               ];
     this.callParent();
     //Set form values
       this.getForm().setValues(record);
   }
});

【讨论】：

【解决方案2】：

问题很困难：从 View1 发送的动作被执行，因为视图 2 被渲染！即使我的代码是这样想的：

ControllerOfView1
{
CodeToLoadView2;
InstructionsToControlView2;
}

解决方案是在我的 View2 上添加一个侦听器并参数化后渲染。所以代码变成了：

 afterrender: function() {
            this.loadRecord(this.getMyVar2());
        }

【讨论】：

【解决方案3】：

您可以使用自定义触发事件，因为您可以发送您想要的数据和组件引用。

app.fireEvent('selectionChanged',view1.grid);

您需要在 view2 中监听 selectionChanged。像

app.on("selectionChanged",onSelectionChanged)

onSelectionChanged : function(grid){
            console.log(grid);
}

【讨论】：