Javascript ExtJS与React、scope混淆

在我的应用程序中，我使用ExtJS和React。我试图覆盖一些功能，但在定义自定义Ext组件时遇到了一些问题。我怀疑这是由“this”的不同范围造成的

有两种情况。第一个是工作场景，但以非优雅的方式实现。第二种情况是需要的，但不起作用

---

场景1-有效-

index.js

app.jsx

---

场景2-它不起作用-

index.js

app.jsx

场景2的错误消息：

---

---

我对作用域有一个基本的了解，我甚至不确定它是否更能反映JavaScript问题。我的代码中遗漏了什么吗

由于React的工作方式以及您在React原型中设置扩展方法，ExtJS

callParent

对于从何处调用事件感到困惑，因此您必须手动指定

addBodyCls: function(cls) {
     // custom logic here
     console.log("inside addBodyCls");
     return this.superclass.addBodyCls.apply(this, arguments);
 }

---

你应该做这个把戏

您是在使用ExtReact还是在尝试自己将ExtJS与ReactJS集成？谢谢您的回复。我试着自己把它整合起来。为了澄清，我正在使用基于ExtJS的库。您能尝试使用CodePen（）重现这个问题吗？是的，我已经创建了两个小片段，我将它们放入描述中。非常感谢！这对我帮助很大。

class CustomScheduleApp extends React.Component {
    ...
    render() {
        <CustomSchedule ...></CustomSchedule>
    }

}

class CustomSchedule extends React.Component {
    ...
    componentDidMount() {
        let taskContextMenu = Ext.create("CustomContextMenu");
        ...
    }
}

ReactDOM.render(
    React.createElement(CustomScheduleApp),
    document.getElementById('schedule-app')
);

class CustomScheduleApp extends React.Component {
    ...
    render() {
        <CustomSchedule ...></CustomSchedule>
    }

}

class CustomSchedule extends React.Component {
    ...
    componentDidMount() {
        Ext.define('CustomContextMenu', {
            extend: 'Dummy.plugin.ContextMenu',
            createMenuItems: function() {
                return this.callParent() // keep standard behaviour
                // "this" has fewer keys in this scenario, some data is missing
            }
        });

        let taskContextMenu = Ext.create("CustomContextMenu");
        ...
    }
}

Uncaught TypeError: Cannot read property 'apply' of null

addBodyCls: function(cls) {
     // custom logic here
     console.log("inside addBodyCls");
     return this.superclass.addBodyCls.apply(this, arguments);
 }