在 keen client.query.then() 中调用 this.setState() returns 无法读取属性 setState

Question

我的反应组件中有一个敏锐的提取查询设置。当我在 keen 的 table 中呈现 keen 查询结果时，它工作正常。
当我尝试将查询结果存储在状态内并尝试在自定义数据 table 中呈现该数据时，就会出现问题。

下面是我敏锐查询的代码：

Keen.ready(function () {
  const element = document.getElementById('keen-table-chart');
  const chart = new Keen.Dataviz()
    .el(element)
    .type('table')
    .height(400)
    .prepare();
  client
    .query('extraction', {
      event_collection: 'Arrivy Datastore',
      timeframe: 'this_30_days',
      timezone: 18000,
      filters: filtersArray,
      property_names: propertyNames
    })
    .then(res => {
      this.setState({
        queryResults: res
      }, () => { this.renderDataTable(res); });
    })
    .catch(err => {
      chart
        .message(err.message);
    });
});

this.setState在.then()returnsCannot read property 'setState' of undefined.

Answer 1

您似乎超出了组件上下文。这是由于您在第一行的 function-call 删除了 this-context。

您将需要使用 bind 或箭头函数。由于您已经在使用箭头函数，因此代码可能是这样的。

Keen.ready(() => {
  const element = document.getElementById('keen-table-chart');
  const chart = new Keen.Dataviz()
    .el(element)
    .type('table')
    .height(400)
    .prepare();
  client
    .query('extraction', {
      event_collection: 'Arrivy Datastore',
      timeframe: 'this_30_days',
      timezone: 18000,
      filters: filtersArray,
      property_names: propertyNames
    })
    .then(res => {
      this.setState({
        queryResults: res
      }, () => { this.renderDataTable(res); });
    })
    .catch(err => {
      chart
        .message(err.message);
    });
});

在 keen client.query.then() 中调用 this.setState() returns 无法读取属性 setState

calling this.setState() inside keen client.query.then() returns cannot read property setState

javascript

reactjs

keen-io

在 keen client.query.then() 中调用 this.setState() returns 无法读取 属性 setState

calling this.setState() inside keen client.query.then() returns cannot read property setState

javascript

reactjs

keen-io

在 keen client.query.then() 中调用 this.setState() returns 无法读取属性 setState