最大化/恢复对话框时出现重复引用

Question

最大化/恢复包含一些带有名称的表单字段的对话框时，例如：

Ext.create('Ext.Dialog', {
  maximizable: true,
  items: {
      xtype: 'textfield',
      name: 'id',
      bind: '{record.id}'
  },
  buttons: [{
    text: 'Save',
    bind: {
      disabled: '{!record.valid}'
    }
  }]
}).show();

我们收到错误：

Ext.mixin.Container.attachNameRef(): Duplicate name: "id" on ext-viewport between ext-textfield-1 and ext-textfield-5

Answer 1

找到两个解决方法：

1. 禁用动画

Ext.define('Override.Dialog', {
  override: 'Ext.Dialog',
  config: {
    maximizeAnimation: false,
    restoreAnimation: false
  }
});

2. 使用于动画的代理没有项目（也没有按钮，因为按钮禁用状态可能不反映有界值

Ext.define('Override.Dialog', {
  override: 'Ext.Dialog',
  config: {
    maximizeProxy: {
      items: null,
      buttons: null
    }
  }
});

Answer 2

背景信息

在

maximize

和

minimize

期间，ExtJS 创建一个影子克隆。 这将创建窗口的克隆，而您仍然拥有原始项目。

使用ID意味着在任何给定时间只能有一个相同的。

克隆尝试创建具有相同 ID 的文本字段，但这不起作用。

通常您想要

• 对于表单，您通常不需要抓取每个项目，因为您可以在表单上使用

  validator

  和

  getValues

• 否则您可能想在视图中使用

  references

  并在控制器中使用

  lookupReference

  。
• 不使用动画（因为这不会创建克隆）
• 编写自己的最大化动画并自己完成动画部分（编写自己的最大化函数）

Answer 3

我创建了这个 Fiddle ，它应该抛出这个错误，但它没有。但我在我的应用程序中遇到了与 OP 相同的错误。
有人知道为什么会发生这种情况吗？ Ofc 如果我包含解决方法，我的应用程序中的问题就会消失。
但我真的很想知道，为什么小提琴可以工作......
使用 ext-modern 7.7.