1. 對helloworld.html中id為template 的<script>（下簡稱“tpjs”）進行修改

<script type="text/x-template" id="template"><div padding="10"><label text="請在此輸入"/><input type="text" name="name"/><button type="button" >點擊</button></div></script>

頁面顯示如下，注意：tpjs里只能存在一個子標簽，多個子標簽將無法顯示，這里用<div>作為子標簽。

2. 將div改成Panel

<script type="text/x-template" id="template"><Panel padding="10"><label text="請在此輸入"/><input type="text" name="name"/><button type="button" >點擊</button></Panel></script>

網頁的樣式出現了變化，Panel是flyingon的模板關鍵字，表示模具，對模板進行鑄模的工具。

在Panel添加layout="vertical-line" 屬性，<Panel layout="vertical-line" padding="10">，該標簽下的子標簽采用垂直線性布局。

3. 修改tpjs和fyjs（flyingon所在的<script>代碼塊）代碼，注意tpjs中的冒號“:”

<script type="text/x-template" id="template"><Panel :layout="lay" :padding="pad"><label :text="txt1"/><input type="text" name="name"/><button type="button" :text="txt2"></button></Panel></script><script type="text/javascript">flyingon.view({host: 'container',template: '#template',defaults: {lay: 'vertical-line',pad:'10',txt1:'請在此輸入',txt2:'點擊'}});</script>

4.將文件另存為template.html

總結

以上是生活随笔為你收集整理的002.template模板的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。