聚合物2應用：紙按鈕沒有文字

我，所用聚合物CLI創建聚合物2應用

polymer init

然後我選擇了聚合物-2-初學者工具包

我嘗試一些paper buttons添加到我的廠景文件，但我發現紙按鈕沒有添加到涼亭的依賴關係，所以我自己添加了它。我bower.json看起來是這樣的：

{ 
 
    "name": "my-app", 
 
    "authors": [ 
 
    "Ehsun" 
 
    ], 
 
    "license": "", 
 
    "dependencies": { 
 
    "app-layout": "PolymerElements/app-layout#2.0-preview", 
 
    "app-route": "PolymerElements/app-route#2.0-preview", 
 
    "iron-flex-layout": "PolymerElements/iron-flex-layout#2.0-preview", 
 
    "iron-icon": "PolymerElements/iron-icon#2.0-preview", 
 
    "iron-iconset-svg": "PolymerElements/iron-iconset-svg#2.0-preview", 
 
    "iron-localstorage": "PolymerElements/iron-localstorage#2.0-preview", 
 
    "iron-media-query": "PolymerElements/iron-media-query#2.0-preview", 
 
    "iron-pages": "PolymerElements/iron-pages#2.0-preview", 
 
    "iron-selector": "PolymerElements/iron-selector#2.0-preview", 
 
    "paper-icon-button": "PolymerElements/paper-icon-button#2.0-preview", 
 
    "polymer": "Polymer/polymer#^2.0.0-rc.1", 
 
    "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0-rc.1", 
 
    "paper-button": "PolymerElements/paper-button#1.0.14" 
 
     
 
    }, 
 
    "devDependencies": { 
 
    "web-component-tester": "6.0.0-prerelease.5" 
 
    }, 
 
    "private": true 
 
}

，我添加了標記，以我的觀點一個是這樣的：

<!-- 
 
@license 
 
Copyright (c) 2016 The Polymer Project Authors. All rights reserved. 
 
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 
 
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 
 
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 
 
Code distributed by Google as part of the polymer project is also 
 
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 
 
--> 
 

 
<link rel="import" href="../bower_components/polymer/polymer-element.html"> 
 
s<link rel="import" href="../bower_components/paper-button/paper-button.html"> 
 
<link rel="import" href="../bower_components/paper-styles/paper-styles.html"> 
 
<link rel="import" href="shared-styles.html"> 
 

 

 

 
<dom-module id="my-view1"> 
 
    <template> 
 
     <style include="shared-styles"> 
 
      :host { 
 
       display: block; 
 

 
       padding: 10px; 
 
      } 
 
     </style> 
 

 
     <div class="card pink" > 
 
      <h1>Start Now</h1> 
 
      <a href="/view2"><paper-button raised class="indigo">go</paper-button></a> 
 
     </div> 
 

 

 
     <paper-button class="pink">link</paper-button> 
 
     <paper-button raised class="indigo">raised</paper-button> 
 
     <paper-button toggles raised class="green">toggles</paper-button> 
 
     <paper-button disabled class="disabled">disabled</paper-button> 
 
    </template> 
 

 

 
    <script> 
 
     class MyView1 extends Polymer.Element { 
 
      static get is() { 
 
       return 'my-view1'; 
 
      } 
 
     } 
 

 
     window.customElements.define(MyView1.is, MyView1); 
 
    </script> 
 
</dom-module>

現在的按鈕無文字，如下所示：

來源

2017-03-12 ehsun7b

您應該嘗試使用'paper-button'的'2.0-preview'分支。見[this]（https://www.polymer-project.org/2.0/docs/about_20#elements）doc。 – a1626

謝謝。它現在有效。這是解決方案。如果你發佈這個答案，會很好。 – ehsun7b

我可以看到您使用1.0.14標記paper-button。這應該與聚合物的不兼容，因爲聚合物V2.x在網絡組件的v1規範上，並且在v0上是paper-button v1.x。

爲什麼您的文本沒有出現的具體原因應該是棄用content標籤，以便支持v1規範中的slot標籤。

您應該嘗試2.0-preview分行/標記paper-button。

來源

2017-03-13 05:39:41 a1626

聚合物2應用：紙按鈕沒有文字

回答

相關問題