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

Posted 2023-03-07

【中文标题】来自 chrome 控制台的聚合物属性

【英文标题】：Polymer properties from chrome console

【发布时间】：2018-02-22 17:39:08

【问题描述】：

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

【参考方案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') 选择元素，但这很乏味 这样做，您将失去控制台自动完成功能。时间就是金钱。