Question

使用聚合物paper-swatch-picker，我正在尝试更改图标，但它没有更新。

下面是我用来更改图标的CSS代码。这是对的吗？

HTML：

<paper-swatch-picker class="fancy"></paper-swatch-picker>

CSS：

paper-swatch-picker.fancy {
      --paper-swatch-picker-color-size: 10px; -- works
      --paper-swatch-picker-icon-size: 40px; -- works
      --paper-swatch-picker-icon: {
          'icon':'menu' -- not works(icon not getting changed)
        }
    }

Answer 1

您可以使用属性iron-icons/iron-icons.html来更改它而不是CSS。但您需要先根据您使用的设置导入menu。在这种情况下，您使用的是iron-icons.html图标，该图标属于默认集maps:...something。例如，iron-icons/maps-icons.html将属于<base href="https://raw-dot-custom-elements.appspot.com/PolymerElements/paper-swatch-picker/v2.2.0/paper-swatch-picker/"> <script src="../webcomponentsjs/webcomponents-lite.js"></script> <link rel="import" href="paper-swatch-picker.html"> <link rel="import" href="../neon-animation/web-animations.html"> <link rel="import" href="../iron-icons/iron-icons.html"> <style> paper-swatch-picker { margin: 0 10px; } </style>  <paper-swatch-picker icon="menu" color="#E91E63"></paper-swatch-picker>

api/json.php

我还写了一篇文章，其中包括顶级颜色选择器Web组件，包括纸质样本选择器。如果你想阅读，这是link。

Polymer paper-swatch-picker如何更改Icon

1 个答案: