时间戳

首页 > 解决方案 > ajax请求后填充状态属性

arrays - ajax请求后填充状态属性

问题描述

我有一个问题reactjs。我想将另一个属性 ( productGroups) 添加到现有状态 ( this.state.mainProductGroups- type object array)。所以我想在数组中找出对应的条目并将新属性添加到其中。这是我的功能：

getProductGroups(mainProductGroupId) {
    $.ajax({
        type: "POST",
        context:this,
        dataType: "json",
        async: true,
        url: "ajax.php",
        data: ({ 
            requestType: 'getProductGroups',
            countryID: this.state.countryObject.countryNo,
            languageID: Language[this.state.currentLanguage].languageNo,
            mainProductGroupID: mainProductGroupId,
        }),
        success: function (data) {
           let mainProductGroups = this.state.mainProductGroups;
           let mainPGFound = false;
           let mainPG = mainProductGroups.filter(mainProductGroup => mainProductGroup.id == mainProductGroupId);
           mainPG.productGroups = data.productGroups;
           this.setState({
              mainProductGroups: mainProductGroups,
           });

        }
    });
  }

这是一个数据示例this.state.mainProductGroups：

在此处输入图像描述

现在的问题是，该productsGroup物业没有被填满。ajax 请求返回正确的值（也是 type object array）。为什么不更新？有问题吗，因为属性的初始值productGroups是string，现在我想用object array? 难道我做错了什么？我是不是想错了？感谢您的任何帮助！

标签： arraysreactjsstate

解决方案

将您的成功处理程序更改为此

 success: function (data) {}

由此

 success: (data)=> {}

查看何时设置状态，同时编写function它是this回调中上下文的新范围。所以它不会从上下文中this找到。this你需要的是一个带有箭头函数的词法作用域。在这种情况下，这是您需要的。

这里的问题是

通常，如果我们正在编写 ES5，我们将使用 Function.prototype.bind 之类的东西从另一个作用域中获取 this 值，以更改函数的执行上下文。这将主要用于不同范围内的回调。

在这里查看更多

推荐阅读