使用Polymer的<google-sheets>自定义元素在网站中加载多个标签数据？

Question

使用<google-sheets>自定义元素

将多个标签中的数据加载到一个页面中

我使用Polymer 1.0创建网站。我试图找出使用自定义元素<google-sheets>将不同标签中的多个数据加载到单个网页中的最佳方式。

我对<google-sheets>自定义元素有几个问题：

1. 将数据从多个标签加载到单个网页的最佳方法是什么？
2. 是否可以加载header cell data？

这是我到目前为止所得到的：

• jsfiddle： https://jsfiddle.net/oneeezy/xrz34f9t/
• google sheet： https://docs.google.com/spreadsheets/d/1wdYvOljnxE3HVRat4TSfFb6sWU0dYCeGjoPtQMcTiUs/edit?usp=sharing

CODE（不是一直工作）：

＆＃13;
＆＃13;
        Polymer({
          is: 'sheets-website'
        });
＆＃13;
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: sans-serif;
}

html,
body {
  min-height: 100%;
}
section { background: #fff; }
article { padding: 1rem 3rem; }

h1 { padding: 2rem 0; text-align: center; background: #f2f2f2; font-weight: normal; border-top: 7px solid #999; }
h2 { margin: 2rem 0 .25rem; }
＆＃13;
<!-- base -->
<base href="https://cdn.rawgit.com/download/polymer-cdn/1.7.0/lib/">

<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link href="polymer/polymer.html" rel="import">
<link rel="import" href="google-sheets/google-sheets.html">


<dom-module id="sheets-website">
  <template>

    <main>

      <!-- GOOGLE SHEET
      ------------------------->
      <google-sheets id="sheet"
                     key="1wdYvOljnxE3HVRat4TSfFb6sWU0dYCeGjoPtQMcTiUs"
                     tab-id="1"
                     rows="{{rows}}"
                     tab="{{tab}}"
                     open-in-google-docs-url="{{openInGoogleDocsUrl}}"
                     published></google-sheets>

      <!-- Sheet 1
      ------------------------------------------------>
      <section>
        <h1>Google Sheet Tab 1:
          <a href="{{openInGoogleDocsUrl}}" target="_blank">
            "<span>{{tab.title}}</span>"
          </a>
        </h1>
        
        <article>
          
          <template is="dom-repeat" items="[[rows]]">
            <h2>{{item.gsx$title.$t}}</h2>
            <p>{{item.gsx$description.$t}}</p>
          </template>
          
        </article>
      </section>
      
      

      <!-- Sheet 2
      ------------------------------------------------>
      <section>
        <h1>Google Sheet Tab 2:
          <a href="{{openInGoogleDocsUrl}}" target="_blank">
            "<span>{{tab.title}}</span>"
          </a>
        </h1>
        
        <article>
        
          <ul>
          <template is="dom-repeat" items="[[rows]]">
            <li>
              <a href="{{item.gsx$link.$t}}">{{item.gsx$name.$t}}</a>
            </li>
          </template>
          </ul>
          
        </article>
      </section>


    </main>

  </template>
</dom-module>




<!-- Custom Element 
---------------------------------------->
<sheets-website></sheets-website>
＆＃13;
＆＃13;
＆＃13;