React — 未定义错误？

Question

这段代码在我的环境中确实有效，我实际上正在尝试创建一个 fiddle 来提出不同的问题，但需要先解决这个问题...

为什么控制台显示 'favorited' 未定义？

class BtnFav extends React.Component {
  constructor(props) {
    super(props);
    this.state = {favorited: false};
    this.handleClick = this.handleClick.bind(this);
  }
  handleClick() {
    this.setState({favorited: !this.state.favorited});
  }
  render() {
    var favStatus = this.state.favorited ? 'btn-fav' : 'btn-notfav';
    return (
      <button className={favStatus} onClick={this.handleClick}>FAVORITE</button>
    );
  }
};

Answer 1

我能找到的唯一错误是 'background' 的拼写错误。在您指定的原始示例中：

.btn-fav {
    backround-color: green;
}

.btn-notfav {
    backround: red;
}

属性正确拼写为 background 或 background-color

查看更新后的示例：https://jsfiddle.net/69z2wepo/49511/

React — 未定义错误？

React — not defined error?

state

reactjs