核心页面与纸张输入不呈现冲突

时间:2014-12-24 03:28:09

标签: polymer

使用核心页时,不显示纸张输入。

<core-pages  selected="{{selected}}">
    <section id="page1">
      <paper-input value="{{origin}}" label="Origin"></paper-input>
      <div>
        A: {{origin}}
      </div>
    </section>
    <section id="page2">
      <div>2</div>
    </section>
  </core-pages>

1 个答案:

答案 0 :(得分:0)

我略微调整了你的例子并把它放在jsfiddle上,并在这里剪了一下:

http://jsfiddle.net/kreide/e13jme4y/

<link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html">
<link rel="import" href="http://www.polymer-project.org/components/paper-elements/paper-elements.html">
<link rel="import" href="http://www.polymer-project.org/components/core-elements/core-elements.html">
<polymer-element name="my-core-pages" attributes="selected" noscript>
    <template>
        <style>
            core-pages {
                width: 300px;
                height: 300px;
                border: 1px solid black;
                -webkit-user-select: none;
                border-radius: 5px;
            }
            core-pages > section {
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: inherit;
            }
        </style>
        <core-pages selected={{selected}}>
            <section id="page1">
                <paper-input value="{{origin}}" label="Origin"></paper-input>
                <div>A: {{origin}}</div>
            </section>
            <section id="page2">
                <div>2</div>
            </section>
        </core-pages>
    </template>
</polymer-element>
<my-core-pages selected="0"></my-core-pages>

正如您所见,纸张输入正确显示。未设置selected属性或未导入paper-input.html可能会导致您描述的行为。