mip-vd-tabs tab切換組件
mip-vd-tabs 用來支持網(wǎng)頁中標(biāo)簽頁的顯示。標(biāo)簽頁內(nèi)元素較多時不建議使用,會影響頁面性能.
示例
一共支持5種樣式
等分固定標(biāo)簽頁
<mip-vd-tabs> <section> <li>第一頁</li> <li>第二頁</li> <li>第三頁</li> <li>第四頁</li> </section> <div>內(nèi)容1</div> <div>內(nèi)容2</div> <div>內(nèi)容3</div> <div>內(nèi)容4</div> </mip-vd-tabs>
橫滑標(biāo)簽頁
<mip-vd-tabs allow-scroll> <section> <li>第一季</li> <li>第二季</li> <li>第三季</li> <li>第四季</li> <li>第五季</li> <li>第六季更新至09</li> </section> <div>內(nèi)容1</div> <div>內(nèi)容2</div> <div>內(nèi)容3</div> <div>內(nèi)容4</div> <div>內(nèi)容5</div> <div>內(nèi)容6</div> </mip-vd-tabs>
帶下拉按鈕的橫滑標(biāo)簽頁
<mip-vd-tabs allow-scroll toggle-more toggle-label="自定義文字"> <section> <li>第一季</li> <li>第二季</li> <li>第三季</li> <li>第四季更新至09</li> </section> <div>內(nèi)容1</div> <div>內(nèi)容2</div> <div>內(nèi)容3</div> <div>內(nèi)容4</div> </mip-vd-tabs>
底部標(biāo)簽頁
<mip-vd-tabs allow-scroll type="bottom" current="3"> <div>內(nèi)容1</div> <div>內(nèi)容2</div> <div>內(nèi)容3</div> <div>內(nèi)容4</div> <section> <li>第一季</li> <li>第二季</li> <li>第三季</li> <li>第四季更新至09</li> </section> </mip-vd-tabs>
劇情展開標(biāo)簽頁
<mip-vd-tabs type="episode" toggle-more toggle-label="老九門劇情選集" allow-scroll total="23" current="11" text-tpl="看第{{x}}集" link-tpl="http://www.baidu.com/{{x}}/juji"> </mip-vd-tabs>
屬性
type
說明:一共有三種特型, bottom(底部選項(xiàng)卡), episode(劇情選項(xiàng)卡), 不填則為默認(rèn)特型
必填項(xiàng):否
allow-scroll
說明:允許滑動
必填項(xiàng):否
toggle-more
說明:是否顯示下拉按鈕. 前置依賴于allow-scroll屬性
必填項(xiàng):否
toggle-label
說明:下拉說明文字. 前置依賴于toggle-more屬性
必填項(xiàng):否
current
說明:當(dāng)前已選標(biāo)簽頁, 從0開始計(jì)數(shù)(current="3"表示第4個標(biāo)簽頁). 當(dāng)type="episode"時,表示當(dāng)前劇集,從1開始計(jì)數(shù)(current="4"表示第4集),默認(rèn)為1.
必填項(xiàng):否
total
說明:劇集總數(shù). 前置依賴于type="episode",并且當(dāng)type="episode"為必填
必填項(xiàng):否
page-size
說明:每頁顯示劇集數(shù). 前置依賴于type="episode",默認(rèn)為50
必填項(xiàng):否
text-tpl
說明:顯示在標(biāo)簽頁上的劇集文案, "第{{x}}集"里的"{{x}}"將被替換成表示集數(shù)的數(shù)字. 前置依賴于type="episode".
必填項(xiàng):否
link-tpl
說明:標(biāo)簽頁和下拉菜單里的劇集跳轉(zhuǎn)鏈接, 鏈接里的"{{x}}"將被替換成表示集數(shù)的數(shù)字. 前置依賴于type="episode",當(dāng)type="episode"為必填.
必填項(xiàng):否
head-title
說明:標(biāo)簽頁和下拉菜單里的劇集跳轉(zhuǎn)新頁面的頭部標(biāo)題. 前置依賴于type="episode",當(dāng)type="episode"為必填.
必填項(xiàng):否