javascript - 项目不可迭代

Question

我尝试创建一个搜索功能和过滤功能widt javascript。我从Firebase获取数据。

也许我只是累了，但我无法到达“this.retter”，因为它不可迭代。任何人都可以帮忙 - 我如何参考这个数据列表？:-)

//CLASS AND READ

    class MadService {
  constructor() {
    this.foodRef = firebaseDB.collection("madretter");
    this.userRef = firebaseDB.collection("users");
    this.authUser;
    this.authUserRef;
    this.retter;
    this.read();
  }

  read() {
    // SE DATABASEN OM DER ER ÆNDRINGER
    this.foodRef.onSnapshot(snapshotData => {
      let retter = [];
      snapshotData.forEach(doc => {
        let ret = doc.data();
        ret.id = doc.id;
        retter.push(ret);
      });
      this.appendFood(retter);
    });
  }



//SEARCH FUNCTiONALITY
      //SØGEFUNKITONEN
  search(value) {
    let searchQuery = value.toLowerCase();
    let searchFood = [];
    for (let ret of this.retter) {
      let overskrift = ret.name.toLowerCase();
      if (overskrift.includes(searchQuery)) {
        searchFood.push(ret);
      }
    }
    console.log(searchFood);
    this.appendFood(searchFood);
  }

谢谢！:-)

标签： javascriptfirebasegoogle-cloud-firestoreiterable

Answer 1

this.retter在undefined您的代码中。在尝试对其进行迭代之前，您需要在某个时刻将其初始化为可迭代对象。下面是将其初始化为数组的示例（this.retter = [];在构造函数中注意）。

我添加了addPhonyData方法并注释掉了一些东西，所以代码可以作为一个例子：

//CLASS AND READ

class MadService {
  constructor() {
    this.foodRef; // = firebaseDB.collection("madretter");
    this.userRef; // = firebaseDB.collection("users");
    this.authUser;
    this.authUserRef;
    this.retter = [];
    //this.read();
    this.addPhonyData();
  }

  read() {
    // SE DATABASEN OM DER ER ÆNDRINGER
    this.foodRef.onSnapshot(snapshotData => {
      let retter = [];
      snapshotData.forEach(doc => {
        let ret = doc.data();
        ret.id = doc.id;
        retter.push(ret);
      });
      this.appendFood(retter);
    });
  }

  addPhonyData() {
    this.retter.push({
      name: 'DuMMy'
    });
  }

  search(value) {
    let searchQuery = value.toLowerCase();
    let searchFood = [];
    for (let ret of this.retter) {
      let overskrift = ret.name.toLowerCase();
      if (overskrift.includes(searchQuery)) {
        searchFood.push(ret);
      }
    }
    console.log(searchFood);
    //this.appendFood(searchFood); - not defined
  }
}

const ms = new MadService();

ms.search('dummy');