javascript - Bagaimana untuk menulis tab dengan cara yang dipacu data?

Question

Saya harap anda boleh bercakap tentang contoh penggunaan js atau jquery dan bukannya vue dan rangka kerja lain

Maaf kerana tidak menjelaskan apa yang saya maksudkan ialah menggunakan data untuk memacu kemas kini UI, bukannya mengemas kini data dan mengemas kini UI pada masa yang sama, seperti contoh di bawah

    var tabSwitch = (function(){
        var lastIndex = 0;

        return function(){
            //    点击tab导航，触发tab切换事件
            $('.oa-tab').on("click", ".oa-tab-nav", function(e){
                var index = $(this).index();
                $(".oa-tab").trigger("tab.switch", index);
            });

            $(".oa-tab").on("tab.switch", function(e, index){
                //    更新tab导航
                $(".oa-tab-nav").eq(lastIndex).removeClass('active');
                $(".oa-tab-nav").eq(index).addClass('active');
                //    更新tab内容
                $(".oa-tab-item").eq(lastIndex).removeClass('active');
                $(".oa-tab-item").eq(index).addClass('active');
                lastIndex = index;
            });
            //    初始化触发
            $(".oa-tab").trigger("tab.switch", 0);
        };
    })();


    tabSwitch();

Answer 1

Poster menyebut bahawa hanya terdapat satu kawasan paparan, dan data pemuatan hanya dijana semula dalam kawasan paparan tersebut berdasarkan pilihan di atas? Jika ini berlaku, sebenarnya apabila anda mengklik pada pilihan, anda mula-mula mengosongkan kawasan paparan, kemudian memanggil data yang sepadan dan menjana penampilan yang sepadan dan kemudian menambahnya ke kawasan paparan

Answer 2

Data dipacu? Adakah anda bermaksud meminta data secara dinamik melalui ajax apabila mengklik tab?