Question

我想在聚合物中添加带导航菜单的图像图标。应该是什么方式。我想要像下面这样的东西。

Answer 1

您可以使用Polymer Elements目录中的一组iron-icons并选择您喜欢的图标进行处理。

确保在导入Polymer组件

后导入组件

如果您想添加自定义图标，请结帐iron-iconset组件。

这是代码示例。

<!DOCTYPE html>
<html>
  <head>
    <meta name="description" content="basic polymer jsbin">
    <meta charset="utf-8">
    
    <base href="//polygit.org/components/">
    <script src="webcomponentsjs/webcomponents-lite.js"></script>
    
    <link rel="import" href="polymer/polymer.html">
    <link rel="import" href="iron-icons/iron-icons.html">

    <dom-module id="test-app">
      <template>
        
        <style>
          
          :host {
            color: #000;
          }
          
        </style>
        <iron-icon icon="icons:home"></iron-icon>
        <span>Home</span>
        
      </template>
      <script>
        HTMLImports.whenReady(function() {
          Polymer({
            
            is: 'test-app',
            
            ready: function() {
              
            }
          
          });
        });
      </script>
    </dom-module>

  </head>
  <body>
    <test-app></test-app>
  </body>
</html>

如何在聚合物中添加导航菜单的图像图标

1 个答案: