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));
}

Polymer 2.0 的函数外的 Polymer 访问函数

Polymer access functions outside a function with Polymer 2.0

firebase

polymer

polymerfire

polymer-2.x