javascript - polymer 图标和纸张图标未显示-6ren

javascript - polymer 图标和纸张图标未显示

转载作者：太空狗更新时间：2023-10-29 14:01:42

25

4

我有一个名为 input-header 的 polymer 1.x 元素，它看起来像这样

<link rel="import" href="../../bower_components/polymer/polymer.html">

<dom-module id="input-header">

  <template>

    <style>
      .dropdown-content {
        padding: 0px;
      }
    </style>

    <paper-toolbar>

      <paper-icon-button icon="mail"></paper-icon-button>
      <iron-icon icon="image:transform"></iron-icon>
      <div class="title">Left</div>

      <paper-menu-button horizontal-align="right" vertical-align="top">
        <paper-icon-button icon="more-vert" class="dropdown-trigger"></paper-icon-button>
        <div class="title">Right</div>
      </paper-menu-button>
    </paper-toolbar>

  </template>

  <script>
    Polymer({

      is: 'input-header',

      properties: {

        label: {
          type: String,
          notify: true
        }

      }

    });
  </script>

</dom-module>

我已将其包含在我的 index.html 中，如下所示:

<body unresolved id="app">

   <input-header label="Left"></input-header>

</body>

但由于某种原因，纸质图标或铁质图标并未显示为此处所示

最佳答案

更新: 查看此工作 demo

您必须导入 paper-icon-button、iron-icon 和 image-icons.html，无论是全局还是在这个特定的元素。像这样

 <!-- import the iron-icon & paper-icon-button custom element -->
 <link rel="import"
  href="path/to/iron-icons/iron-icons.html">

  <!----- this is required for iron-icon image:transform to work ----->
 <link rel="import"
  href="path/to/iron-icons/image-icons.html">
 <!---------------------------------------------->

 <link rel="import"
  href="path/to/paper-icon-button/paper-icon-button.html">
 <link rel="import"
  href="path/to/paper-toolbar/paper-toolbar.html">
 <link rel="import"
  href="path/to/paper-menu-button/paper-menu-button.html">

我假设您已经安装/下载了 iron-icon 和其他元素。如果您使用的是 Bower，请执行此操作

  bower install --save PolymerElements/iron-icon 
  bower install --save PolymerElements/paper-icon-button

从 Polymer Element Catalog 中查找其他元素的 bower 安装命令

关于javascript - polymer 图标和纸张图标未显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34475790/

25

4

0

文章推荐： git - 没有共同祖先的分支

文章推荐： android - 如何在android中将 Activity 作为单独的任务运行？

文章推荐： java - 无法恢复 Android 应用程序中的 Activity 错误

文章推荐： Git Merge 跳过提交

javascript - polymer :纸张 slider 产生波纹误差
我正在尝试在我的 1.0 polymer 元素之一中实现纸张 slider ... 我得到的错误是: Uncaught TypeError: this.has
Vaadin 14 纸张 slider 销属性
我还是 Vaadin 的新手，我正在尝试使用 Vaadin 14 实现 @polymenr/paper-slider 组件。我已经下载了项目https://github.com/berndhopp/
Vaadin 14 纸张 slider 销属性
我还是 Vaadin 的新手，我正在尝试使用 Vaadin 14 实现 @polymenr/paper-slider 组件。我已经下载了项目https://github.com/berndhopp/
html - Internet Explorer 上的 CSS 错误阴影效果(纸张 curl )
我正在尝试像这样实现页面 curl : 我遵循了这个例子:http://codepen.io/anon/pen/fpjoa 如果我创建新的 PHP 和 CSS 文件并从上面的链接复制粘贴代码，结果是正

首页

博学

6Ren·AI

商城

javascript - polymer 图标和纸张图标未显示