无法访问纸张输入值聚合物答案

【问题标题】：Paper-input value not accessible Polymer无法访问纸张输入值聚合物
【发布时间】：2017-10-16 20:35:07
【问题描述】：

我对 Polymer 很陌生，但认为这是一个很棒的概念，尽管我在实现我通常没有问题的非常基本的东西时遇到了一些麻烦。

我有一个模板，其中有一个纸张输入元素。如果我填充这个元素，我希望能够单击一个按钮并将值从该输入字段传输到其他地方。简单吧？

不，无论我做什么，我似乎都无法访问该输入字段的值。好像身份证不存在一样。我认为是因为shadow dom，但我完全不知道为什么！

我已尝试使用 this.$.messaged.value、document.querySelector('#messaged').value 等，但均未成功。还需要做什么？提前致谢！！

<link rel="import" href="../../../bower_components/paper-input/paper-input.html">
<dom-module id="dd-bully">
    <template>
 <paper-input id="messaged" value="{{messaged}}"></paper-input>
    <paper-button raised on-tap="sendmsg"></paper-button>
    </template>
    <script src="bully.js"></script>
</dom-module>

以及下面的脚本内容：

class Bully extends Polymer.Element {
        static get is() {
            return 'dd-bully';
        }

        static get properties() {
            return {
                messaged: {
                    type: String,
                    value: "test message"
                }
            };
        }
        sendmsg() {
            this.messaged = window.msg /* latest test */
            console.log(messaged)
            window.socket.emit('sendmsg', window.msg, err => {
                if (err) {
                    console.error(err);
                    return;
                }
            });
        }
    }
    customElements.define(Bully.is, Bully);

【问题讨论】：

标签： javascript polymer polymer-2.x

【解决方案1】：

<paper-input> 已经通过双向数据绑定（即value="{{messaged}}"）更新messaged。在sendmsg() 中，您可以通过this.messaged（而不是this.messaged.value）读取messaged 的值。

sendmsg() {
  console.log('messaged', this.messaged);
  this.messaged += ' SENT!';
}

demo

【讨论】：

@Erik 没问题 :)