在ReactJS中切换类

Question

我正在尝试在点击“关注”按钮时将className切换为“有效”。我已经尝试按照反应网站上的教程和指南以及其他参考资料但没有运气。以下是我的代码：

import React from 'react';
import styles from './Cover.css';
import withStyles from '../../decorators/withStyles';
import Link from '../../utils/Link';
import Avatar from './Avatar';

import { Button } from 'react-bootstrap';

@withStyles(styles)
class Cover extends React.Component {


  render() {
    return (
      <div className="Cover">
        <div className="Cover-container">
          <div>
            <Avatar 
              username="hilarl" 
              profession="Web Developer" 
              location="New York, New York"
              status="I am here to protect my business, a bunch of kids are out to ruin me" />
              <div className="Cover-submenu-container">
                <div className="Cover-submenu-section">
                  .
                </div>
                <div className="Cover-submenu-section links">
                  <a href="#" className="Cover-submenu-link">
                    <i className="fa fa-twitter"></i>
                  </a>
                  <a href="#" className="Cover-submenu-link">
                    <i className="fa fa-facebook"></i>
                  </a>
                </div>

                // follow button

                <div className="Cover-submenu-section connect-menu">
                  <Button className="follow-btn" href="#">Follow</Button>
                </div>
              </div>
          </div>
        </div>
      </div>
    );
  }
}

export default Cover;

如果有人能帮忙解决这个问题会很棒。感谢