Javascript 未捕获（承诺中）类型错误：无法读取属性'；设置状态'；评估时未定义的

使用library Intercat.js，我想做一个拖放应用程序，我可以将一些卡从一种状态拖到另一种状态，方法是将它们拖到一个新列中，问题是当我将一张卡放到一个新列中时，状态没有改变，我在this.setState中有错误，“this”在拖放函数中未定义，但是，当我重新启动页面时，状态会根据我的需要进行更改。 这是我的密码

componentDidMount() {
    …
    interact('.dropzone').dropzone({
      accept: '#yes-drop',
      overlap: 0.10,

      // listen for drop related events:
      ondropactivate(event) {
        event.target.classList.add('dropActive');
      },
      ondragenter(event) {
        currentActionId = event.relatedTarget.firstChild.id;
        nextActionTypeTitle = event.currentTarget.innerText;
        console.log('Dragged in');
      },
      ondragleave(event) {
        console.log('Dragged out');
      },
      // eslint-disable-next-line no-unused-vars
      ondrop(event) {
        console.log('droppped');
      },
      // eslint-disable-next-line no-unused-vars
      ondropdeactivate(event) {
        // eslint-disable-next-line array-callback-return
        actionTypesTab.map(row => {
          if ((row.typeName + ' ' + row.percentage + ' %') === nextActionTypeTitle) {
            newCommercialActionType = { _id: row.actionTypeId };
            // eslint-disable-next-line array-callback-return
            commercialActionsTab.map(line => {
              if (line._id === currentActionId) {
                // eslint-disable-next-line array-callback-return
                line.contacts.map(column => { column.checked = true; });
                line.contactsIds = line.contacts;
                line.commercialActionId = line._id;
                line.commercialActionType = newCommercialActionType;
                CommercialActionService.updateCommercialAction(line).then(result => {
                  newData = result.data.payload;
                  this.setState({ commercialActions: newData }); <----------------- The problem (this is undefined)
                });
              }
            });
         }
        });
      }
    });

componentDidMount（）{
…
交互（'.dropzone'）。dropzone({
接受：“#是，放弃”，
重叠：0.10，
//侦听与拖放相关的事件：
ondropactivate（事件）{
event.target.classList.add（'dropActive'）；
},
ondragenter（事件）{
currentActionId=event.relatedTarget.firstChild.id；
nextActionTypeTitle=event.currentTarget.innerText；
console.log（'drawing'）；
},
昂德拉格（事件）{
console.log（“拖出”）；
},
//eslint禁用下一行无未使用的变量
昂德罗普（事件）{
console.log（'dropped'）；
},
//eslint禁用下一行无未使用的变量
ondropdeactivate（事件）{
//eslint禁用下一行数组回调返回
actionTypesTab.map（行=>{
如果（（row.typeName+''+row.percentage+'%'）==nextActionTypeTitle）{
newCommercialActionType={u id:row.actionTypeId}；
//eslint禁用下一行数组回调返回
commercialActionsTab.map（行=>{
如果（行.\u id==currentActionId）{
//eslint禁用下一行数组回调返回
line.contacts.map（column=>{column.checked=true；}）；
line.contactsIds=line.contacts；
line.commercialActionId=line.\u id；
line.commercialActionType=newCommercialActionType；
updateCommercialAction（行）。然后（结果=>{
newData=result.data.payload；
this.setState（{commercialActions:newData}）；