在单击“纸张选项卡”之前,页面不显示

奥涅兹

在单击纸张选项卡之前,不会显示我的滑动页面。

我没有使用该template[is="dom-bind"]方法,

我正在尝试使其在Polymer({ is: ...脚本内运行(不确定是否正确)

这是我现在所拥有的:

    <!--
    :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
        Forms (page)
    ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: -->
    <link rel="import" href="../../bower_components/polymer/polymer.html">
    <link rel="import" href="../../bower_components/iron-swipeable-pages/iron-swipeable-pages.html">

    <link rel="import" href="../components/component-page.html">
    <link rel="import" href="forms-contact.html">
    <!-- <link rel="import" href="forms-rebuild.html"> -->


    <dom-module id="page-forms">
    <template>

        <style>
        :host {
            display: block;
            width: 100%;
            height: 100%;
            box-sizing: border-box;
            background: #fff;
        }

        iron-swipeable-pages { z-index: 1; }
        iron-swipeable-pages > * {
            padding: 2rem;
            -webkit-user-select: none;  /* Chrome all / Safari all */
            -moz-user-select: none;     /* Firefox all */
            -ms-user-select: none;      /* IE 10+ */
            user-select: none;          /* Likely future */
            cursor: default;
        }
        forms-contact {  }
        .page { height: 100%; }

        </style>


    <!--  Content
    ---------------------------------------------------------------------------------------------------------------->
        <component-page grid="vertical" layout="start-center" padding-t="20" min-height="1">

            <!-- Select Menu -->
            <paper-tabs selected="{{selectedForm}}" mobile-width=".9"
                                                    tablet-width=".75"
                                                    desktop-width=".5">
                        <paper-tab>
                            <iron-icon icon="communication:forum"></iron-icon>
                            Contact Form
                        </paper-tab>

                        <paper-tab>
                            <iron-icon icon="icons:settings"></iron-icon>
                            Rebuild Form
                        </paper-tab>
            </paper-tabs>


            <iron-swipeable-pages on-selected-changed="_onSelectedChanged" selected="{{selectedForm}}" flex="auto" width="100" show-arrow>

                        <!-- Contact Form -->
                        <div class="page" grid="vertical" layout="start-center">
                            <forms-contact mobile-width=".9" tablet-width=".75" desktop-width=".5"></forms-contact>
                        </div>

                        <!-- Contact Form -->
                        <div class="page" grid="vertical" layout="start-center">
                            <forms-contact mobile-width=".9" tablet-width=".75" desktop-width=".5"></forms-contact>
                        </div>
            </iron-swipeable-pages>

            <fx-skew bg="white"></fx-skew>
        </component-page>
    <!--  Content
    ---------------------------------------------------------------------------------------------------------------->

    </template>



    <script>

        Polymer({
          is: "page-forms",

          selectedForm: {
                    value: 0
                  },

          _onSelectedChanged: function(e) {

              var target = e.target;
              target.isGesture ? console.log("Swiped by Gesture!") : console.log("Swiped by Selection!");
          }

        });

    </script>
    </dom-module>
宫本

selectedForm直接将其指定为值为{value: 0}而不是属性的属性:

      Polymer({
          is: "page-forms",
          properties: {
              selectedForm: {type: Number, value: 0},
          },
      });

cf. 聚合物:声明的属性

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

加载页面时默认选项卡不显示内容

来自分类Dev

Django + Jquery +选项卡,单击时不显示选项卡

来自分类Dev

Django + Jquery +选项卡,单击时不显示选项卡

来自分类Dev

Bootstrap 选项卡 - 单击选项卡时不显示内容

来自分类Dev

在显示新选项卡之前,WinForm TabControl选项卡页面的内容不会更新

来自分类Dev

带有链接的纸张选项卡显示问题

来自分类Dev

android选项卡内容不显示

来自分类Dev

iOS:UI-设计登录页面和选项卡视图-登录后不显示选项卡

来自分类Dev

ExtJS选项卡面板-选项卡不显示

来自分类Dev

xamarin 表单:如何在单击选项卡时关闭选项卡页面并显示上一页?

来自分类Dev

单击页面上的链接,这将更改新页面上显示的选项卡

来自分类Dev

JSP页面中的“显示”选项卡

来自分类Dev

单击选项卡有时会显示错误的页面

来自分类Dev

仅向活动选项卡显示课程,其余选项卡不显示课程

来自分类Dev

在终端上查看选项卡分隔值(不显示选项卡)

来自分类Dev

选项卡栏控制器将不显示选项卡Xcode 7

来自分类Dev

Angular slickgrid 不显示在动态选项卡内(ngx-bootstrap 选项卡集)

来自分类Dev

选项卡中不显示操作栏

来自分类Dev

使用选项卡时不显示ActionBar

来自分类Dev

UITabBarController不显示其他选项卡的标题

来自分类Dev

Bootstrap / Bootswatch下拉选项卡不显示

来自分类Dev

Titanium iOS:选项卡将图像不显示

来自分类Dev

UITabBarController不显示其他选项卡的标题

来自分类Dev

为什么选项卡的内容不显示?

来自分类Dev

离子:选项卡视图不显示后退按钮

来自分类Dev

Far Manager 不显示新选项卡(PanelTabs)

来自分类Dev

从水平选项卡列表中单击激活部分可见选项卡并显示完整选项卡

来自分类Dev

加载页面或单击其他位置时,选项卡CSS不会在活动选项卡上突出显示

来自分类Dev

刷新选项卡单击引导上的页面

Related 相关文章

  1. 1

    加载页面时默认选项卡不显示内容

  2. 2

    Django + Jquery +选项卡,单击时不显示选项卡

  3. 3

    Django + Jquery +选项卡,单击时不显示选项卡

  4. 4

    Bootstrap 选项卡 - 单击选项卡时不显示内容

  5. 5

    在显示新选项卡之前,WinForm TabControl选项卡页面的内容不会更新

  6. 6

    带有链接的纸张选项卡显示问题

  7. 7

    android选项卡内容不显示

  8. 8

    iOS:UI-设计登录页面和选项卡视图-登录后不显示选项卡

  9. 9

    ExtJS选项卡面板-选项卡不显示

  10. 10

    xamarin 表单:如何在单击选项卡时关闭选项卡页面并显示上一页?

  11. 11

    单击页面上的链接,这将更改新页面上显示的选项卡

  12. 12

    JSP页面中的“显示”选项卡

  13. 13

    单击选项卡有时会显示错误的页面

  14. 14

    仅向活动选项卡显示课程,其余选项卡不显示课程

  15. 15

    在终端上查看选项卡分隔值(不显示选项卡)

  16. 16

    选项卡栏控制器将不显示选项卡Xcode 7

  17. 17

    Angular slickgrid 不显示在动态选项卡内(ngx-bootstrap 选项卡集)

  18. 18

    选项卡中不显示操作栏

  19. 19

    使用选项卡时不显示ActionBar

  20. 20

    UITabBarController不显示其他选项卡的标题

  21. 21

    Bootstrap / Bootswatch下拉选项卡不显示

  22. 22

    Titanium iOS:选项卡将图像不显示

  23. 23

    UITabBarController不显示其他选项卡的标题

  24. 24

    为什么选项卡的内容不显示?

  25. 25

    离子:选项卡视图不显示后退按钮

  26. 26

    Far Manager 不显示新选项卡(PanelTabs)

  27. 27

    从水平选项卡列表中单击激活部分可见选项卡并显示完整选项卡

  28. 28

    加载页面或单击其他位置时,选项卡CSS不会在活动选项卡上突出显示

  29. 29

    刷新选项卡单击引导上的页面

热门标签

归档