ES6 class inheritance problem

export default class Base extends Component<Props> {
    constructor(props) {
        super(props);
        console.log("Base this",this)//this showToast renderModal
    }

    /*
    *Toast
    * */
    showToast=(msg)=>{
        console.log("showToast",this)
    }

    /**
     *
     * */
    renderModal(contentView, visible, close, animation, customerlayout){
     console.log("renderModal",this)
    }


    componentDidMount() {
    }

    componentWillUnmount() {
    }

}

when used in subclasses

super.renderModal("hahahhah")//
 super.showToast("hahahhah")//

basethis

ask for a detailed explanation

Function class class es6 javascript

Mar.02,2021

The

arrow function does not have its own this. Its this does not point to the current subclass or base object as you might think, but the current object at the time of definition. If you created the base class in the global scope, it is undefined.

this has nothing to do with the arrow function.

In fact, the only second way to write

is es6's class syntax:

this.renderModal("hahahhah")//
this.showToast("hahahhah")//

Previous: In an elastic layout, the width of the parent element is not fixed, how to ensure that the child element scrolls horizontally without supporting the parent element?

Next: What if docker can't see the information displayed before?