Javascript 单击按钮后，颜色会发生变化

我目前在点击按钮时更改按钮颜色方面遇到了一些问题：

我当前的按钮代码如下：

handleClick = () => {
   secondary=true
 }
<RaisedButton className={classPrefix + '-listToggle'}
  label="List View"
  onClick = {this.handleClick}
  icon={<Icon name="list" size={15} />}
/>

handleClick=（）=>{
次要=真
}

我还有一个名为“secondary”的布尔值，如果为“true”，则会更改按钮的背景色。如果我执行以下代码：

<RaisedButton className={classPrefix + '-listToggle'}
  label="List View"
  onClick = {this.handleClick}
  secondary=true
  icon={<Icon name="list" size={15} />}
/>

按钮颜色仅在加载时更改，单击时保持不变

我最终想让它做的是，若点击按钮，将secondary设置为true，否则，保留false

---

帮助？

我建议您使用状态来确定按钮是否为辅助按钮。 无论如何，您甚至没有在任何地方初始化

辅助变量

class App extends React.PureComponent {

  state = {
    active: false,
  };

  handleClick = () => {
    this.setState({ active: true });
  };

  render() {
    return (
      <RaisedButton className={classPrefix + '-listToggle'}
        label="List View"
        onClick={this.handleClick}
        icon={<Icon name="list" size={15} />}
      />

      <RaisedButton className={classPrefix + '-listToggle'}
        label="List View"
        secondary={this.state.active}
        icon={<Icon name="list" size={15} />}
      />
    )
  }
}

类应用程序扩展了React.PureComponent{
状态={
活动：错误，
};
handleClick=（）=>{
this.setState（{active:true}）；
};
render（）{
返回(
)
}
}
我建议您使用状态来确定按钮是否为辅助按钮。
无论如何，您甚至没有在任何地方初始化
辅助变量

class App extends React.PureComponent {

  state = {
    active: false,
  };

  handleClick = () => {
    this.setState({ active: true });
  };

  render() {
    return (
      <RaisedButton className={classPrefix + '-listToggle'}
        label="List View"
        onClick={this.handleClick}
        icon={<Icon name="list" size={15} />}
      />

      <RaisedButton className={classPrefix + '-listToggle'}
        label="List View"
        secondary={this.state.active}
        icon={<Icon name="list" size={15} />}
      />
    )
  }
}

类应用程序扩展了React.PureComponent{
状态={
活动：错误，
};
handleClick=（）=>{
this.setState（{active:true}）；
};
render（）{
返回(
)
}
}