Question

我目前在React Native中有一个组件

export default class Category extends Component {}

为了简化代码，我将不包含所有内容，但以下代码位于此类之内。

我有以下在按钮上执行时有效的方法：

  dbGetValues(subCatId) {
    let subValues = [];
    db.transaction(tx => {
      tx.executeSql(
        'SELECT * FROM dr_template_relational '
        + ' INNER JOIN  dr_report_categorie_values on dr_report_categorie_values.id = dr_template_relational.value_id'
        + ' WHERE dr_template_relational.subcategory_id = ' + subCatId + ' AND dr_template_relational.template_id = ' + this.state.currentTemplateId,
        [],
      (trans, result) => {
        const sqLiteResults = result.rows._array;

        sqLiteResults.forEach(el => {
          subValues.push({ subCategoryId: subCatId, values: el.value_id, name: el.name, narrative: el.narrative })
        })
      });
    },
    (err) => console.error(err),
    () => {
      return subValues;
    }
  );
  }

然后我有此方法。在以下方法中，我尝试执行：dbGetValues()。我得到的错误是dbGetValues不是。功能

  dbGetTemplateOptions() {
    let dataArray = [];
    let subcategories = this.state.subcategories;
    console.log(subcategories);
    subcategories.forEach(function (item) {
      dataArray.push({
        title: item.name,
        content: <Text>{this.dbGetValues(item.subCatId)}</Text>
      });
    });

    return dataArray;
  }

this.dbGetValues可在其他方法中使用，但是当放置在forEach中时，会出现此错误。我知道这与范围有关，但我不明白为什么。自从我进入React课堂后，它不起作用吗？我已经读过很多有关“ this”的文章，但我仍然不厌其烦。
我什至尝试绑定this.dbGetValues = this.dbGetValues.bind(this);

编辑：试图将功能变成粗箭头： dbGetTemplateOptions =（）=> {} dbGetValues =（subCatId）=> {} 结果相同。

Answer 1

可以肯定的是，由于dbGetTemplateOptions是一个常规函数，因此调用它的上下文是绑定的。这意味着this不是您期望的对象。

您可以通过将dbGetTemplateOptions转换为箭头函数来进行修复，以使this始终为this object。

编辑：我在这里看到另一个问题。

您的行在这里：

subcategories.forEach(function (item) {

使用function。这意味着当forEach调用您的函数时，其上下文将以不同的方式绑定。尝试将function (item) {更改为item => {

React类内部的方法未执行

1 个答案: