CODEWITHSUNDEEP
javascriptreactjs
Curtis
Curtis

Reputation: 2704

ReactJS - Uncaught TypeError: Cannot call a class as a function

Trying to compile my code & I can't get past this error; I've looked around on here at a few other questions but they're all pointing me in the direction of not extending the React.Component but I'm doing that?

The error I've got is:

bundle.js:72109 Uncaught TypeError: Cannot call a class as a function
    at _classCallCheck (bundle.js:72109)
    at TopBar (TopBar.js:14)
    at Game.render (Game.js:53)

TopBar.js:

import React from 'react';
import Engine from '../game-logic/GameEngineStore';
import GameSettingsStore from '../stores/GameSettingsStore';
import * as Clib from '../game-logic/clib';

function getState() {
  return {
    balanceBitsFormatted: Clib.formatSatoshis(Engine.balanceSatoshis)
  };
}

export default class TopBar extends React.Component {

  constructor(props, context) {
    super(props, context);
    this.state = getState();
  }

}

Game.js

import TopBar from './TopBar';

export default class Game extends React.Component {

  render() {
    const state = this.state;
    return (
      <div id="game-inner-container">
        { TopBar({ isMobileOrSmall: state.isMobileOrSmall }) }
      </div>
    );
  }

}

Upvotes: 2

Views: 426

Answers (1)

kind user
kind user

Reputation: 41913

The error message seem to be clear - you are trying to call a class as a function. Just turn it into a JSX module:

<TopBar isMobileOrSmall={state.isMobileOrSmall} />

Upvotes: 2

Related Questions