ExtJS 6-将代理数据绑定到表单

我有一个从Web服务检索信息的代理存储，我希望以网格的方式在面板中显示该信息，在其中我设置“dataIndex”参数以绑定检索到的数据

我如何在没有额外编码的情况下实现这个目标，这是可能的吗

大概是这样的：

代理存储：

Ext.define('MyStore', {

  extend: 'Ext.data.Store',
  alias: 'store.myStore',
  model: 'myModel',
  autoload: true,

  proxy: {
    type: <wsType>,
    url: <wsUrl>
  },
  scope: this

});

Ext.define（'MyStore'{
扩展：“Ext.data.Store”，
别名：“store.myStore”，
模型：“myModel”，
自动加载：对，
代理：{
类型：，
网址：
},
范围：本
});

专家组：

Ext.define('<myPanel>', {

   extend: 'Ext.panel.Panel',

   ...

   store: Ext.create(<myStore>),

   ...


   items: [
   {
     xtype: 'titlePanel',
     cls: 'titlePanel',
     html: '<div class="titlePanel"><h1>My Title</h1></div>',
   },
   {
      xtype: 'form',
      layout: 'vbox',
      cls: 'whitePanel',
      items: [
      {
         xtype: 'panel',

         layout: 'column',
         items: [
         {
             xtype: 'displayfield',
             displayField: 'name',
             dataIndex: 'name',
             fieldLabel: Ext.locale.start,
             name: 'start'
        },
   ...

Ext.define（“”{
扩展：“Ext.panel.panel”，
...
存储：Ext.create（），
...
项目：[
{
xtype:'标题板'，
cls:“标题板”，
html:“我的标题”，
},
{
xtype:'表单'，
布局：“vbox”，
cls:“白色面板”，
项目：[
{
xtype:'面板'，
布局：“列”，
项目：[
{
xtype:'displayfield'，
displayField:'名称'，
数据索引：“名称”，
字段标签：Ext.locale.start，
名称：“开始”
},
...

显示单个记录不需要存储。可以在模型级别定义代理

Ext.define('MyApp.model.Contact', {
    extend: 'Ext.data.Model',
    fields: ['id', 'firstName', 'middleName', 'lastName'],
    proxy: {
        type: 'ajax',
        url: 'contacts.json',
        reader: {
            type: 'json',
            rootProperty: 'data'
        }
    }
});

在视图构造函数/initComponent或控制器init方法中加载模型，加载后将记录推送到ViewModel

initComponent: function() {
    this.callParent(arguments);
    var me = this;
    MyApp.model.Contact.load(1, {
        success: function(record, operation) {
            me.getViewModel().set('contact', record);
        }
    })
},

将模型特性绑定到显示字段

        items: [{
            name: 'firstName',
            fieldLabel: 'First Name',
            bind: '{contact.firstName}',
            xtype: 'displayfield'
        }]

这是小提琴

---

显示单个记录不需要存储。可以在模型级别定义代理

Ext.define('MyApp.model.Contact', {
    extend: 'Ext.data.Model',
    fields: ['id', 'firstName', 'middleName', 'lastName'],
    proxy: {
        type: 'ajax',
        url: 'contacts.json',
        reader: {
            type: 'json',
            rootProperty: 'data'
        }
    }
});

在视图构造函数/initComponent或控制器init方法中加载模型，加载后将记录推送到ViewModel

initComponent: function() {
    this.callParent(arguments);
    var me = this;
    MyApp.model.Contact.load(1, {
        success: function(record, operation) {
            me.getViewModel().set('contact', record);
        }
    })
},

将模型特性绑定到显示字段

        items: [{
            name: 'firstName',
            fieldLabel: 'First Name',
            bind: '{contact.firstName}',
            xtype: 'displayfield'
        }]

这是小提琴

---

如果您只想在显示表单中显示记录，则通常存储用于多个记录。为什么您不能在模型级别定义代理并使用model.load加载单个记录。完全正确！谢谢，您有一个简单的示例吗？如果您只想在d中显示记录，通常存储用于多个记录iPlay表单。为什么不能在模型级别定义代理并使用model.load加载单个记录。这是完全正确的！谢谢，你有一个简单的例子吗？超级棒，这正是我想要的！谢谢。如果我需要这种行为，但现在返回的json包含两个数组字段来填充2个差异，我该怎么办erent网格？超级棒，这正是我想要的！谢谢。如果我需要这种行为，但现在返回的json包含2个数组字段来填充2个不同的网格，我该怎么办？