komponen penukaran tab mip-vd-tabs


mip-vd-tabs digunakan untuk menyokong paparan tab dalam halaman web. Ia tidak disyorkan untuk menggunakannya apabila terdapat banyak elemen dalam halaman tab, kerana ia akan menjejaskan prestasi halaman

QQ截图20170204132252.png

Contoh

Sebanyak 5 gaya disokong

Halaman tab tetap dalam bahagian yang sama

<mip-vd-tabs>
    <section>
        <li>第一页</li>
        <li>第二页</li>
        <li>第三页</li>
        <li>第四页</li>
    </section>
    <div>内容1</div>
    <div>内容2</div>
    <div>内容3</div>
    <div>内容4</div>
</mip-vd-tabs>
.

Halaman tab gelongsor mendatar

<mip-vd-tabs allow-scroll>
    <section>
        <li>第一季</li>
        <li>第二季</li>
        <li>第三季</li>
        <li>第四季</li>
        <li>第五季</li>
        <li>第六季更新至09</li>
    </section>
    <div>内容1</div>
    <div>内容2</div>
    <div>内容3</div>
    <div>内容4</div>
    <div>内容5</div>
    <div>内容6</div>
</mip-vd-tabs>

Mendatar dengan butang lungsur ke bawah Halaman tab gelongsor

<mip-vd-tabs allow-scroll toggle-more toggle-label="自定义文字">
    <section>
        <li>第一季</li>
        <li>第二季</li>
        <li>第三季</li>
        <li>第四季更新至09</li>
    </section>
    <div>内容1</div>
    <div>内容2</div>
    <div>内容3</div>
    <div>内容4</div>
</mip-vd-tabs>

Halaman tab bawah

<mip-vd-tabs allow-scroll type="bottom" current="3">
    <div>内容1</div>
    <div>内容2</div>
    <div>内容3</div>
    <div>内容4</div>
    <section>
        <li>第一季</li>
        <li>第二季</li>
        <li>第三季</li>
        <li>第四季更新至09</li>
    </section>
</mip-vd-tabs>

Laman tab pengembangan plot

<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>

Atribut

Attribut

:Ada tiga jenis bawah

tab), episod (tab plot), biarkan kosong Ia adalah jenis lalai

Item yang diperlukan: Tidak

benarkan tatal

Penerangan: Benarkan gelongsor

Item yang diperlukan: Tidak

togol-lagi

Penerangan: Sama ada untuk dipaparkan butang lungsur turun. Bahagian hadapan bergantung pada atribut benarkan tatal

Item yang diperlukan: Tidak

label togol

Penerangan: Teks penerangan lungsur ke bawah bergantung pada atribut togol-lebih

Item yang diperlukan: Tidak

semasa

Penerangan: Halaman label yang dipilih pada masa ini, mengira daripada 0 (semasa="3" bermaksud tab ke-4 Apabila taip="episod", ia bermaksud episod semasa, mengira daripada 1 (semasa="4" bermaksud). episod ke-4), lalai ialah 1.

Item Diperlukan: Tidak

jumlah

Penerangan: Jumlah bilangan episod Awalan bergantung pada jenis="episod", dan apabila jenis="episod" diperlukan

Item yang diperlukan. : Tidak

saiz halaman

Penerangan: Setiap Halaman memaparkan bilangan episod Awalan bergantung pada jenis="episod", lalai ialah 50

Medan yang diperlukan: Tidak

teks-tpl

Penerangan: Episod. salinan dipaparkan pada halaman tab, "{{x} }"{{x}}" dalam "episod" akan digantikan dengan nombor yang menunjukkan bilangan episod. Awalan bergantung pada jenis="episod".

link-tpl

Penerangan: halaman tab dan Untuk pautan lompat episod dalam menu lungsur, "{{x}}" dalam pautan akan digantikan dengan nombor yang menunjukkan bilangan episod Awalan bergantung pada type="episode", apabila type="episode" diperlukan

Diperlukan: Tidak

head-title

Penerangan: Tajuk kepala halaman baharu apabila episod dalam halaman tab dan menu lungsur turun. Bahagian hadapan bergantung pada jenis="episod", apabila jenis="episod" Diperlukan.
Medan yang diperlukan: Tidak🎜🎜