填充标签的值

Question

我正在使用 MVC 架构（我已经阅读了 MVC 上的文档，但我仍然在这里迷路）并且我需要知道如何将记录填充到我的标签上。我知道我必须由商店完成这项工作。

我已从商店加载了值，但由于某种原因无法在我的面板上显示它。这是我的代码；

大多数示例/书籍都演示了如何在网格中显示，而不是在标签中显示（我知道它必须是相同的逻辑，但我迷路了）。它显示了如何写入 DB/JSON 文件而不显示值。

我需要在标签文本中显示 COUNTRYNAME。这是我正在做的一个示例代码来理解这一点，有人可以帮助我吗？

Ext.define ('ProjectDisplayExample.model.Country',{
    extend: 'Ext.data.Model',
    //
    fields:['countryid','countryname']
    //
});

商店

Ext.define('ProjectDisplayExample.store.Country',{
    extend:'Ext.data.Store',
    model:'ProjectDisplayExample.model.Country',
    remoteGroup:true,
    proxy: {
        actionMethods : {
            read   : 'POST',
        },
        type: 'ajax',
        url : '/server/country.php'
    }   
});

查看

Ext.define('ProjectDisplayExample.view.CountryWindow', {
    extend: 'Ext.window.Window',
    alias: 'widget.countrywindow',
    ...........

    initComponent: function() {
        var st = Ext.getStore('Country');
        st.load();
        this.items = [
        {
            items: [
            {
                xtype: 'panel',
                region: 'north',
                items: [{
                    xtype: 'label',
                    // NEED TO DISPLAY COUNTRT NAME FROM THE STORE HERE
                }]
            }]
}

更新

var store = ... // Your store
store.on('load', function() {
    // here store is loaded and you can do anything you want with it
    console.log('store is loaded. number of records = ', store.getCount());
}, this, { single: true });

store.load; // I ADDED THIS LINE.................... <---------

更新 2

this.items = [
            {
                items: [
                {
                    xtype: 'panel',
                    region: 'north',
                    items: [{
                        xtype: 'label',
                        name : f
                    }]
                }]

Answer 1

我不会发布代码示例来完全解决您的问题，但我会给您几点：

• Store 包含数组或记录。所以你不能只在商店里说give me country name。您需要先获取一条记录，例如：var r = store.getAt(0)，然后才能获取countyname字段var f = r.get('countryname')。

• Load() 方法是异步的，因此您可以在代码中的某处执行它，并假设您的存储已准备好下一行。您需要订阅load 事件，例如：

  var store = ... // Your store
  store.on('load', function() {
      // here store is loaded and you can do anything you want with it
      console.log('store is loaded. number of records = ', store.getCount());
  }, this, { single: true });
  store.load();
  

• xtype: label 中的标签实际上很少在 ExtJs 中使用。您到底想在该面板中显示什么？但无论如何......从存储中获取数据后，您可以使用update() 或setValue() 或任何其他方法来更新组件。

希望这会有所帮助...