是否可以在extjs5中动态更新绑定

Is it possible to dynamically update a bind in extjs5?

本文关键字：动态 更新 绑定 extjs5 是否      更新时间：2023-10-03

我正在尝试在extjs5中动态更改绑定，但我不太清楚这是如何实现的，或者是否可能实现，或者我只是完全错误地处理了这件事。我会试着解释我想做什么。我有一个定义如下的文本区域：

id: 'final-view',
xtype: 'textareafield',
editable: false,
bind:{
  value: '{r.options}'
}

在我的视图中我有模型：

data: {
  r:{
    options: {}
  }
}

页面布局如下：

textarea
"Add Option" button
option 1
...
option n

我有一个按钮"添加选项"，它在页面上添加了一个带有选项存储的组合框，然后他们可以从下拉菜单中选择一些内容，并在组合框中键入额外的内容。当组合创建时，我有一个递增的变量，这个数字用于创建唯一的ID：

var new_opt = 'r.options.opt_' + cnt;

这用于向r.options对象添加元素，如下所示：

viewModel.set(new_opt, '');

创建的每个组合都有一个绑定，定义如下：

bind: {
  value: '{r.options.opt_' + this.id.substr(14) + '}'
}

其中"this.id.substr（14）"是我的cnt变量，即1。因此，第一个选项的值绑定为"{r.options.opt_1}"。最终目标是将每个组合框中的所有内容连接并绑定到文本区域。我想做的是在添加选项时动态更新textareafield的绑定，这样当任何组合框被键入时，它都会更新最终视图。因此，例如，如果视图模型中的数据对象有两个选项：

data: {
  r:{
    options: {opt_1: 'value1', opt_2: 'value2'}
  }
}

因此，我想将我的绑定更改为如下：

id: 'final-view',
xtype: 'textareafield',
editable: false,
bind:{
  value: '{r.options.opt_1} {r.options.opt_2}'
}

在文本区域中，您将看到内容"value1 value2"。我想避免的是，每次通过循环遍历"r.options"对象中的所有元素并更改值来从头开始重新填充文本区域，所以我想如果有办法更新值字段的绑定，这会更有效。任何帮助或指导都将不胜感激，我对MVVM范式还是相当陌生的。

您很可能正在寻找setBind（）方法。

只有我的2美分：对我来说，整个事情看起来过于复杂，即使你找到了让它工作的方法，也要考虑简化它

您不需要显式设置绑定。

viewModel.setData（'newValue'）将完成任务。

此外，您是否将这些数据存储在任何地方？如果是这样，您可能需要将其绑定到store.model字段值，那么当数据更改时，共享该模型实例的任何其他视图都将自动更新。如果是这样的话，您可能会将文本区域绑定到"｛model.field｝"，而其余部分则会自动发生。

我希望这能有所帮助。

相关文章：