首页 > 解决方案 > 通过数据绑定设置“min”时,聚合物纸滑块行为异常

问题描述

我在我的自定义元素中使用Polymer's 。paper-slidermin在我的自定义元素中传递一个属性并将其分配给min滑块的值。然而,滑块的行为很奇怪,直到光标到达任一极端并且值在非常高的范围内不断变化时才会滑动。

这是代码:

<link rel="import" href="/bower_components/paper-slider/paper-slider.html">

<dom-module id="slider-two">
    <template>
        <br>
        <br>
        <paper-slider pin min=[[min]]></paper-slider>

    </template>
    <script>
        Polymer({
            is: 'slider-two',
            properties: {
                min: {
                    type: String
                }
            }
        });
    </script>

</dom-module>

用法:

<slider-two min='5'></slider-two>

导致这种奇怪行为的代码中的错误是什么。替换min=[[min]]代码中的 bymax=[[min]]给出了预期的正确结果,而奇怪的行为只是由引起的min。我曾尝试将名称更改为其他名称min

我使用它安装它bower i --save paper-slider并且我正在使用Polymer 1.0.0它(为了它与某个兼容leaflet-map)。

标签: htmlpolymerbowerpolymer-1.0

解决方案


可能问题是您将min属性声明为 aString但根据文档,它应该是一个数字:paper-slider docs

min: number = 0 notify
继承自 Polymer.IronRangeBehavior

表示范围最小值的数字。

尝试声明minNumber

Polymer({
    is: 'slider-two',
    properties: {
        min: {
            type: Number
        }
    }
});

推荐阅读