React Native - Super expression must either be null or a function

Question

I want to build a super class which contains several methods cause I want to call them from different classes. Furthermore, I have the benefit of reducing code.

However, I get the error message "Super expression must either be null or a function"

This is one of my classes where I want to call the function super.interface() from the SuperScreen.js file:

import React from "react";
import { SuperScreen } from "./SuperScreen";

export default class HomeScreen extends SuperScreen {
  constructor(props) {
    super(props);
    this.state = {
      isLoading: true,
      data: null,
      key: 15
    };
  }

render() {
    return super.interface();
  }
}

My SuperScreen.js

import React, { Component } from "react";

export default class SuperScreen extends Component {
  constructor() {}

  interface() {...}
}

However, I still get the message Super expression must either be null or a function. Why and how can I fix it?

Kind regards and Thank You

Answer 1

Your import is a bit messed up. Remove the curly brackets from SuperScreen import because you exported SuperScreen class as default.

import SuperScreen from "./SuperScreen";

Or correct the export instead

export class SuperScreen extends Component