React: call parent version of the functiion when overriding - reactjs

Question

When I'm overriding a function in a child class, how can I call the parent version of that function?
Say I have two components AbstractList and SortableList in React with:
class AbstractList extends React.Component {
getItems() {
...
}
}
class SortableList extends AbstractList {
getItems() {
... do sorting first
return super.getItems(); // QUESTION: how am I supported to actually do this?
}
}
Thanks!

Answer 1

You should not do it this way
check this issue on github
Many people have become accustomed to using OO inheritance not just as
a tool, but as the primary means of abstraction in their application.
I've you've worked at a Java shop, you'll know what I'm talking about.
In my personal opinion, classical OO inheritance (as implemented in
many popular languages) is not often the best tool for most jobs, let
alone all jobs. But the situation should be approached with even more
caution when inheritance is used within a framework or paradigm that
uses functional composition as its primary abstraction (React). There
are certain patterns we'll want to prevent (there are many strange
things that people can come up with when combining render with
inheritance that don't make sense and are addressed via simple
composition). There's also risk of making mutation more convenient. It
might make sense to start with ES6 classes simply as a better syntax
for React component creation, intentionally limiting some use cases
(limiting inheritance depth, making some React base class methods
final) (only when used with React components of course - all non-React
use of ES6 classes wouldn't be restricted).
Instead of this
class AbstractList extends React.Component {
getItems() {
...
}
}
class SortableList extends AbstractList {
getItems() {
... do sorting first
return super.getItems();
}
}
You should do
class AbstractList extends React.Component {
getItems() {
...
}
}
class SortableList extends React.Component {
render() {
return <AbstractList items={this.props.item}>{this.props.children}</AbstractList>;
}
}