使用 Polymer 2.0 的函数之外的 Polymer 访问函数

Question

正如标题所示，我想知道如何从外部访问函数。可以通过使用“this.FunctionName”在 ready() 中执行此操作。但显然，'this' 在 firebase 监听器中是一个 'null' 值。

ready() {
    super.ready();
    //this.displayData("12","13");
    console.log(this);
    var database = firebase.database();
    var myDataref = database.ref('sessions/1');
    myDataref.on('child_added', function(snapshot) {
        var message = snapshot.val();
        //console.log("Left: "+message.left);
        //console.log("Right: "+message.left);
        console.log(this);
        //this.displayData(message.left, message.right);
    });
  }

  displayData(leftData, rightData) {
    var para = document.createElement("li");
    var t = document.createTextNode("Left: "+leftData+", Right: "+rightData);
    para.appendChild(t);
    console.log(para);
    this.$.mes.appendChild(para);
  }

Code

Answer 1

简单的方法是创建一个this 的别名并在firebase 监听器中使用它。

例子：

ready() {
  super.ready();

  var _this = this;
  ...
  myDataref.on('child_added', function(snapshot) {
     ...
    _this.displayData(message.left, message.right);
  });
}

另一种方法是使用 Javascript bind method，它允许您指定 this 的值。

例子：

ready() {
  super.ready();

  ...
  myDataref.on('child_added', function(snapshot) {
     ...
    this.displayData(message.left, message.right);
  }.bind(this));
}