来自 chrome 控制台的聚合物属性答案

【问题标题】：Polymer properties from chrome console来自 chrome 控制台的聚合物属性
【发布时间】：2018-02-22 17:39:08
【问题描述】：

这是一个非常新手的问题，但如何从 Chrome 的控制台引用聚合物属性？我知道我可以通过引用 this.myProperty 从应用程序中的 javascript 输出 (console.log)，但是如何直接从控制台获取对它的引用？

【问题讨论】：

标签： polymer google-chrome-console

【解决方案1】：

你通过某种方法获得对元素的引用，我使用querySelector，所以如果你有一个paper-input 和username-input 类，你可以这样做

document.querySelector('paper-input.username-input').myProperty

这与从元素内部执行this.myProperty 相同。

【讨论】：

【解决方案2】：

在开发过程中仅我在 window 上创建了一个属性，该属性引用了我的元素。

Polymer({
  is: 'nav-bar',

  properties: {
    foo: {
      type: String,
      value: 'foo'
    }
  },

  attached: function() {
    // @TODO remove before merge.
    window.navBar = this
  }
})

在您的控制台中：

// log property
navBar.foo

// call methods
navbar.doSomething()

检查我的元素的属性或调用方法。

当然，这会污染全局范围，但我只在开发期间这样做。您也可以通过querySelector('nav-bar') 选择元素，但这很乏味这样做，您将失去控制台自动完成功能。时间就是金钱。

【讨论】：