Question

我创建了一个带有extjs的菜单，您点击它可以看到菜单项下降。第一项是打开。此按钮应该从文件对话框中打开文件。但我打开文件对话框的唯一方法就是只显示按钮，将 file dialog field 放在菜单中。

现在我需要帮助才能使这个按钮看起来像常规菜单项：

    var item = Ext.create('Ext.form.field.File', {
        buttonOnly: true,
        buttonText: 'Open',
        hideLabel: true,
        // maybe to add some css class here
        listeners: {
             'change': function(fb, v){
            Ext.Msg.alert('Status', item.getValue());
              }
        }
    }); 

    var mainmenu = Ext.create('Ext.menu.Menu', {
        width: 200,
        margin: '0 0 10 0',
        items: [item]
    });

Answer 1

您可以将属性buttonConfig添加到Ext.form.field.File项，然后将标准属性用于按钮。例如，这可能有效：

var item = Ext.create('Ext.form.field.File', {
    buttonOnly: true,
    buttonText: 'Open',
    hideLabel: true,
    buttonConfig: {
        style: {
          background: "#f1f1f1",
          border: 0
        }
    },
    listeners: {
         'change': function(fb, v){
        Ext.Msg.alert('Status', item.getValue());
          }
    }
});

尝试在buttonConfig中更改 cls 而不是 style 属性，以使用CSS类而不是内联CSS。

如何在extjs中使用css来修改“浏览文件”按钮？

1 个答案: