Question

我正在创建一个Sencha touch xtype，它将包含一个不可见的输入文件和一个按钮;我想在按下按钮时触发弹出窗口选择文件。这是我到目前为止所做的：

config: {
    baseCls: 'imageFileField',
    layout: 'hbox',
    items: [
        {
            xtype: 'label',
            baseCls: Ext.baseCSSPrefix + 'form-label'
        },
        {
            xtype: 'container',
            layout: 'hbox',
            flex: 1,
            items: [
                {
                    xtype: 'filefield',
                    hidden: true,
                    listeners: {
                        afterrender: function (cmp) {
                            cmp.fileInputEl.set({
                                accept: 'image/*'
                            });
                        }
                    }
                },
                {
                    xtype: 'label',
                    baseCls: Ext.baseCSSPrefix + 'form-label'
                },
                {
                    xtype: 'button',
                    margin: '5px',
                    docked: 'right',
                    ui: 'base_button',
                    iconCls: '',
                    width: '50px',
                    listeners: {
                        tap: function (view, e, eOpts) {

                        }
                    }
                }
            ]
        }
    ]
},

我知道我应该在tap方法中放置一些东西，导航到该项目然后触发事件。我尝试使用this.up（）/ down（...），但我从来没有能够得到不可见的输入。什么是正确的＆＃34;路径＆＃34;去那儿？

Answer 1

您可以使用Ext.ComponentQuery查找元素并设置其属性。要找到您的元素，您必须先将itemId指定给它。

xtype: 'filefield',
hidden: true,
itemId: 'chooseFile',
listeners: {
              afterrender: function (cmp) {
                  cmp.fileInputEl.set({
                  accept: 'image/*'
                  });
               }
            }

然后，您可以将以下代码放入按钮的侦听器事件中。

listeners: {
               tap: function (view, e, eOpts) {
                      Ext.ComponentQuery.query("container > #chooseFile").show();
                    }
           }

Answer 2

我已将控制器中的所有控件及其正常工作： -

  refs: {
        filefield: 'filefield[name="fileField"]',
        fileBtn: 'button[name="fileBtn"]'
    },

    control: {
        "fileBtn": {
            tap: function() {
                this.getFilefield().show();
            }
        }
    }

Extjs如何获得正确的组件

2 个答案: