Polymer在WAMP中或使用Python呈现空白页面

时间:2015-11-29 23:26:40

标签: python wamp wampserver polymer-1.0 web-component

我是Polymer的新手,我正在使用WAMP在我的本地主机中托管我的Polymer 1.0项目。我已经在本主题中看到了其他问题,但没有一个答案对我有帮助,因为我仍然在Chrome浏览器中显示没有错误(或警告)的空白页面。我唯一得到的是页面顶部看起来像灰色条的东西。

我跟随this tutorial in Youtube

我实际上尝试过在localhost:8000上使用Python并且我得到同样的东西,所以我怀疑我的代码出了问题。

注意1:如果我的声明只有<paper-input>元素,那么它可以正常工作。

注2:代码实际上在开始时工作,但是当我开始做一些实验(!!!)然后页面开始渲染为空白而没有错误!奇怪!

这是我的代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>

    <script src="/bower_components/webcomponentsjs/webcomponents.js"></script>
    <link rel="import" href="/bower_components/polymer/polymer.html">
    <link rel="import" href="/bower_components/paper-header-panel/paper-header-panel.html">
    <link rel="import" href="/bower_components/paper-material/paper-material.html">
    <link rel="import" href="/bower_components/paper-toolbar/paper-toolbar.html">
</head>

<body class="vertical layout" style="background-color: #dddddd;">
    <paper-header-panel>
        <paper-material style="background-color: #ffffff;">
            <paper-toolbar>
                <div>Example My Polymer</div>
            </paper-toolbar>

            <h3>This is my content 1</h3>

            <p>Hello</p>
        </paper-material>
    </paper-header-panel>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

使用paper-header-panel

时,这是一个常见问题
  

重要提示:如果其父级没有高度,则不会显示纸质标题面板。

让你的身体(纸头面板的父母)占据整页身高:

<body class="fullbleed">