Ext.Component.setStyle('color'， 'value') 似乎不起作用

Question

我有两个按钮，想法是单击一个并让另一个的文本更改颜色，即如果单击按钮 1，按钮 2 的文本从当前颜色变为蓝色，反之亦然。 我正在获取对按钮的引用并在引用上调用 setStyle，但它似乎不起作用。欢迎任何见解。代码片段可以在下面找到：-

{
xtype: 'button',
text: 'Foo',
id: 'foo',
ui: 'plain',
toggleGroup: "buttonToggle",
listeners: {
click: "onFooButtonClick",
afterrender: 'onButtonsRendered'
},
toggleHandler: "onButtonToggled"
},
{
xtype: 'tbseparator'
},
{
xtype: 'button',
text: 'Bar',
id: 'bar',
ui: 'plain',
toggleGroup: "buttonToggle",
listeners: {
click: "onBarButtonClick",
afterrender: 'onButtonsRendered'
},
toggleHandler: "onButtonToggled"
}
// Controller.js
onButtonToggled: function(button, state) {
var clickedButton = button.id;
button.btnInnerEl.setStyle('color', 'black');     
if (clickedButton === "foo") {
var btnBar = Ext.getCmp('bar');
btnBar.setStyle('color', 'blue');
} else if (clickedButton === "bar") {
var btnFoo = Ext.getCmp('foo');
btnFoo.setStyle('color', 'blue');
}
}

Answer 1

你的'setStyle'方法错了。您必须使用大括号，并且需要以键值方式添加颜色，如下所示：

所以你需要替换下面的代码：

btnBar.setStyle('color', 'blue');
btnFoo.setStyle('color', 'blue');
button.btnInnerEl.setStyle('color', 'black');

有了这个：

btnBar.setStyle({'color': 'blue'});
btnFoo.setStyle({'color': 'blue'});
button.btnInnerEl.setStyle({'color': 'black'}); 

希望对您有所帮助。