0
ポリマーフレームワークが初めてです。私はポリマー2.0.0-rc.3と最新のクロムを使用しています。しかし、以下のコードはメニューを表示していません。ブラウザーには "Hello World"だけが表示されます。デベロッパーツールコンソールにエラーは表示されません。以下ポリマーでクロムにメニューが表示されない2.0
コード
bower.jsonテストapp.html
<link rel="import" href="../bower_components/polymer/polymer-element.html">
<link rel="import" href="../bower_components/paper-menu/paper-menu.html">
<link rel="import" href="../bower_components/paper-toolbar/paper-toolbar.html">
<link rel="import" href="../bower_components/paper-item/paper-item.html">
<!-- Since 'home' is the default route, eagerly load it. -->
<!-- <link rel="import" href="shop-home.html"> -->
<dom-module id="test-app">
<template>
<H1>Hello World</H1>
<paper-toolbar>
<div class="horizontal-section">
<paper-menu>
<paper-item>Inbox</paper-item>
<paper-item>Starred</paper-item>
<paper-item>Sent mail</paper-item>
<paper-item>Drafts</paper-item>
</paper-menu>
</div>
</paper-toolbar>
</template>
<script>
class testApp extends Polymer.Element {
static get is() { return 'test-app'; }
}
customElements.define(testApp.is, testApp);
</script>
</dom-module>
index.htmlを
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>test</title>
<link rel="import" href="src/test-app.html" async>
</head>
<body>
<test-app unresolved>test</test-app>
<script>
window.performance && performance.mark && performance.mark('index.html');
Polymer = {lazyRegister: true, dom: 'shadow'};
(function() {
if ('registerElement' in document
&& 'import' in document.createElement('link')
&& 'content' in document.createElement('template')) {
// platform is good!
} else {
// polyfill the platform!
var e = document.createElement('script');
e.src = 'bower_components/webcomponentsjs/webcomponents-lite.js';
document.body.appendChild(e);
}
})();
</script>
</body>
</html>
あります0
"polymer": "polymer/polymer#^2.0.0-rc.3", "app-layout": "polymerelements/app-layout#^0.10.7", "app-route": "polymerelements/app-route#^0.9.3", "iron-flex-layout": "polymerelements/iron-flex-layout#^1.3.2", "iron-form": "polymerelements/iron-form#^1.1.4", "iron-icon": "polymerelements/iron-icon#^1.0.12", "iron-pages": "polymerelements/iron-pages#^1.0.8", "iron-selector": "polymerelements/iron-selector#^1.5.2", "paper-icon-button": "polymerelements/paper-icon-button#^1.1.4", "paper-spinner": "polymerelements/paper-spinner#^1.2.1", "iron-media-query": "polymerelements/iron-media-query#^1.0.8", "paper-menu": "polymerelements/paper-menu#^1.2.2", "paper-item": "polymerelements/paper-item#^1.2.1", "paper-toolbar": "polymerelements/paper-toolbar#^1.1.7"
本文は誤りについて考えていますか?どのガイドをどのようにエラーを見つけるためにそれをデバッグできますか?
ほとんどの要素には「2.0プレビュー」と呼ばれる余分な枝があります。それらを使用する必要があります。「ポリメレメント/鉄フォーム## 2.0プレビュー」のように追加してください。ポリマー2と互換性があります – daKmoR
残念ながら、用紙メニューの2.0プレビューブランチはありません。ブートストラップメニューのようにポリマー2.0にメニュー項目を含むメニューを作成する他の方法はありますか? – Moazzam
paper-menuは現在互換性がないようです...いくつかは正常に移植されたようです https://github.com/PolymerElements/paper-menu/issues/110 – daKmoR