从 Javascript 访问聚合物函数

Question

很抱歉给您带来不便（我的英语不是很好，我正在使用翻译器来写这个）。我在 Whosebug 和其他网站上进行了足够的搜索，但没有找到我需要的答案。我正在使用 Polymer 开发一个项目，我在其中声明了如下函数：

Polymer({
  is: 'LaserLand-Cronometro',
  properties: {
    jugadores: Object,
    minuto: Number,
    segundo: Number,
    centesima: Number,
    hora:{
      type: String,
      value: '00:00:00'
    },
    task: Number
  },
  cronometro: function(){
    this.centesima++
    if(centesima>99){
      this.centesima=0
      this.segundo++
    }else if(segundo > 59){
      this.segundo=0
      this.minuto++
    }
    let mm;
    let ss;
    let cc;
    if(this.centesima<9){cc='0'+this.centesima}
    if(this.segundo<9){ss='0'+this.centesima}
    if(this.minuto<9){mm='0'+this.minuto}
    this.hora=mm+':'+ss+':'+cc
  },
  evento: function(e){
    console.log(e);
  }
});

但是当我使用 Socket.io 时，我需要使用 javascript vanilla 来访问它们，例如：

<script>
Polymer({
  is: 'LaserLand-Cronometro',
  properties: {
    jugadores: Object,
    minuto: Number,
    segundo: Number,
    centesima: Number,
    hora:{
      type: String,
      value: '00:00:00'
    },
    task: Number
  },
  cronometro: function(){
    this.centesima++
    if(centesima>99){
      this.centesima=0
      this.segundo++
    }else if(segundo > 59){
      this.segundo=0
      this.minuto++
    }
    let mm;
    let ss;
    let cc;
    if(this.centesima<9){cc='0'+this.centesima}
    if(this.segundo<9){ss='0'+this.centesima}
    if(this.minuto<9){mm='0'+this.minuto}
    this.hora=mm+':'+ss+':'+cc
  },
  evento: function(e){
    console.log(e);
  }
});
var socket = io('http://localhost:7000',{'forceNew': true});
var time;
socket.on('inicio', function(data){
    time = setInterval(cronometro, 100);
});

我已经尝试过不同的方法，但是 none 走路，所以我需要你的帮助。换句话说，是否有任何方法可以直接从 javascript 访问聚合物中声明的函数？

Answer 1

您不能调用此方法，因为尚未创建实例！

从您的代码看来，您已经定义了一个名为“LaserLand-Cronometro”的自定义元素。您的方法 cronometro 将仅在此自定义元素的实例中可用。所以你所要做的就是先create/get一个自定义元素的实例，然后调用它的方法。

您必须在 Polymer registration life cycle 中包含 Socket.io 或自己创建一个实例。

....
var laserLand = document.createElement('LaserLand-Cronometro');

var socket = io('http://localhost:7000',{'forceNew': true});
var time;
socket.on('inicio', function(data){
    time = setInterval(laserLand.cronometro, 100);
});

我可能建议创建一个 custom-element，它通过 socket.io 包装您的后端连接并提供一个 API，以将数据绑定到您的聚合物应用程序中。也许 firebase elements 给了一些灵感。

希望对您有所帮助。

从 Javascript 访问聚合物函数

Accessing polymer functions from Javascript

javascript

socket.io

polymer

polymer-1.0