Question

我遇到了一个与聚合物有关的奇怪问题。将paper-input元素嵌套在paper-item元素下方时，paper-input将不会注册空格键。

示例：

<template>
    <paper-item class="to-do-item">
        <paper-checkbox active="{{done}}"></paper-checkbox>
        <paper-input id="test1" value="Test1"></paper-input>
    </paper-item>
    <paper-input id="test2" value="Test2"></paper-input>
</template>

在此示例中，test1和test2都会输入，但我无法在test1中输入空格，而我可以在test2中输入空格。如果我复制并粘贴空格字符，它可以在任一输入中使用。离奇。有谁知道发生了什么事？

编辑：问题在设备和浏览器，桌面和移动设备上保持一致。

Answer 1

paper-item元素实现两个行为：

Polymer.IronControlState
Polymer.IronButtonState

我认为空格键触摸事件不可用，如果需要，可以用铁项目元素替换纸质项目。

Answer 2

根据github development issue，问题在于聚合物将空间解释为按钮点击，而不是作为输入。问题正在解决，但在此期间，评论IronButtonState行为是一项可行的工作。

behaviors: [
  Polymer.IronControlState/*,
  Polymer.IronButtonState*/
]

Answer 3

此处介绍了另一种解决方法： https://github.com/PolymerElements/paper-item/issues/103

用户SPessall的想法是用一个空函数替换polymer-item的_spaceKeyDownHandler（）函数的实现，这可以通过以下代码轻松完成：

ready: function(){
  this.$$('paper-item')._spaceKeyDownHandler = function () {};
}

POLYMER：在纸张项目下嵌套纸张输入禁用空格键

3 个答案: