Зачем нужно многократно обновлять интерфейс? странная проблема

Question

У меня есть приложение, которое работает плавно и безупречно в процессе разработки, но когда я развертываю его на компоненте заголовка Heroku, он не рендерится сам, а более странная часть, это требует жесткого обновления, чтобы изменить пользовательский интерфейс, также учтите: 1. в инструментах разработчика кеш уже отключен. 2. также forceUpdate (), используемый в жизненном цикле и onClick (). 3. cookie ясно работает нормально. спасибо за помощь.

  componentDidMount() {
    this.forceUpdate();
  }
  forceUpdateHandler = () => {
    this.forceUpdate(this.props.auth);
  };
  renderContent(){
    switch (this.props.auth) {
      case null:
        return; 
      case false:
        return (
          <div>
            <a href="/auth/google" onClick={this.forceUpdateHandler}>Login with Google</a>
          </div>
        );
      default:
        return [
          <span key="1">
            <Payments/>
          </span>,
          <span key="3">
            Credits {this.props.auth.credits}
          </span>,
          <span key="2">
            <a href="/api/logout" onClick={this.forceUpdateHandler}>Logout</a>
          </span>,
        ];
    }
  }  
  render() {
    return (
      <nav>
          <Link to={this.props.auth ? '/surveys' : '/'}>APPNAMEHERE</Link>
          <div>
            {this.renderContent()}
          </div>
      </nav>
    );
  }
}
const mapStateToProps = ({ auth }) => { return { auth }};

export default connect(mapStateToProps)(Header);