【问题标题】:Polymer paper-input-decorator updateLabelVisibility() is not working聚合物纸输入装饰器 updateLabelVisibility() 不起作用
【发布时间】:2015-03-10 11:24:47
【问题描述】:

我不知道如何在 paper-input-decorator 元素上使用 updateLabelVisiblity() 函数。这应该有效,但它没有!

在我的 plunker 中,一个普通的 inputs 值 连接到一个 paper-inputs 值。每当我在正常输入中键入内容时,都会调用一个函数。该函数调用 validate()updateLabelVisiblity

Here is a plunker 这是我的聚合物元素。

<polymer-element name='my-input'>
  <template>
    <h3>Paper input (linked)</h3>
    <paper-input-decorator id='myPaperInput' label='Field' error='error' floatingLabel autovalidate>
      <input is='core-input' pattern='^[0-9]*$' value='{{something}}'>
    </paper-input-decorator>
    <h3>Normal input (linked)</h3>
    <input value='{{something}}' on-keyup='{{mykeyup}}'>
    <p>
      Why doesn't the label show above the paper-input when i start typing in the <b>Normal Input</b>?
    </p>
  </template>
  <script>
    Polymer({
      mykeyup: function(){
        this.$.myPaperInput.validate();
        this.$.myPaperInput.updateLabelVisibility();
      }
    });
  </script>
</polymer-element>

已解决

mykeyup: function(){
    var p = this.$.myPaperInput;
    p.validate();
    p._autoLabelVisible = p.querySelector('input').value !== '' ? false : true;
}

【问题讨论】:

  • 嗯.. 它实际上对我有用。每当我输入非数字字符时,“错误”标签就会出现在您的 plunker 中。
  • 嗨@Andy 我也可以看到 error 标签。我看不到的是浮动标签

标签: polymer


【解决方案1】:

我明白发生了什么。 updateLabelVisibility 需要该值才能显示浮动标签。但是,您也可以使用 updateLabelVisibility 来代替:

this.$.myPaperInput._autoLabelVisible = false;

这基本上只是硬设置了 updateLabelVisibility 设置的值。

这是您的代码,刚刚更新:

http://plnkr.co/edit/l4xQBv7PKft2zqARnPu1?p=preview

参考: https://github.com/Polymer/paper-input/blob/master/paper-input-decorator.html#L474

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多