反应 - 没有定义错误？

Question

这段代码实际上适用于我的环境，我实际上是想创建一个小提琴来提出另一个问题，但需要首先解决这个问题......

为什么控制台说没有定义'收藏'？

FIDDLE

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

我能找到的唯一错误是“背景”拼写错误。在您的原始示例中，您已指定：

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

.btn-notfav {
    backround: red;
}

该属性拼写为background或background-color

请参阅此更新示例：https://jsfiddle.net/69z2wepo/49511/