dsg
Copy This
<template>
    <div class="page" data-name="profile-view">
        <div class="navbar">
            <div class="navbar-bg"></div>
            <div class="navbar-inner">
                <div class="left">
                    <a class="link back">
                        <i class="icon icon-back"></i>
                    </a>
                </div>
                <div class="middle">
                    <div class="header-logo"><img src="assets/img/logo-dark.png" /></div>
                </div>
                <div class="right">
                    
                </div>
            </div>
        </div>

        <div class="page-content profile-landing-page infinite-scroll-content view-page ptr-content ptr-watch-scrollable"
            data-infinite-distance="50" data-ptr-distance="130">

            <div class="ptr-preloader">
                <div class="preloader"></div>
                <div class="ptr-arrow"></div>
            </div>

            <div class="loading-fullscreen">
                <div class="preloader preloader-central">
                    <span class="preloader-inner"><span class="preloader-inner-line"></span><span
                            class="preloader-inner-line"></span><span class="preloader-inner-line"></span><span
                            class="preloader-inner-line"></span><span class="preloader-inner-line"></span><span
                            class="preloader-inner-line"></span><span class="preloader-inner-line"></span><span
                            class="preloader-inner-line"></span>
                    </span>
                </div>
            </div>

            <div class="profile-background" style="background-color:gray;">
            </div>
            <div class="profile-head">
                <div class="profile-image" style="background-color:gray;"></div>
                <h3 class="name profile-username">
                    <div class="skeleton-block" style="width: 100px"></div>
                </h3>
                <h5 class="subtext profile-name">
                    <div class="skeleton-block" style="width: 100px"></div>
                </h5>
                <div class="mt-1">
                    <div class="btn w-70 bg-dark user-follow-btn">
                        <div class="skeleton-block" style="width: 80px"></div>
                    </div>
                </div>
            </div>

            <div class="profile-links">
                <div class="profile-links-external d-flex">
                    <a class="profile-link social-link link external " id="instagram" target="_blank"
                        href="https://www.instagram.com/"><img src="assets/img/icon-instagram.svg" />
                        <span>Instagram</span></a>
                    <a class="profile-link social-link link external " id="facebook" target="_blank"
                        href="https://www.facebook.com"><img src="assets/img/icon-facebook.svg" />
                        <span>Facebook</span></a>
                    <a class="profile-link social-link link external " id="tiktok" target="_blank"
                        href="https://www.tiktok.com"><img src="assets/img/icon-tiktok.svg" /> <span>Tiktok</span></a>
                    <a class="profile-link social-link link external " id="youtube" target="_blank"
                        href="https://www.youtube.com"><img src="assets/img/icon-youtube.svg" />
                        <span>YouTube</span></a>
                    <a class="profile-link social-link popup-open" style="display: none;" display="none" data-popup=".links-popup"><img
                            src="assets/img/icon-link.svg?v=1.4" />
                        <span>More</span></a>
                </div>
            </div>

            <div class="profile-lower">
                <div class="profile-tabs">
          <a href="#profileview-posts-tab" class="tab-link" id="my-posts">Posts</a>
          <a href="#profileview-wastes-tab" class="tab-link" id="my-wastes">Wastes</a>
                              
                    
                </div>

                <swiper-container class="tabs">
                    <swiper-slide id="profileview-posts-tab" class="tab tab-active">
                        <div class="swiper-inner-container">
                            <div class="profile-grid list virtual-list" id="profile-view-grid-posts">
                                <!-- Content generates here -->
                            </div>

                            <!-- Preloader for infinite scroll -->
                            <div class="infinite-scroll-preloader posts-tab view-profile">
                                <div class="preloader"></div>
                            </div>
                        </div>
                    </swiper-slide>
                  
                    <swiper-slide id="profile-wastes-tab" class="tab">
                      <div class="swiper-inner-container">
                        <div class="profile-grid" id="profile-grid-wastes">
                          <!-- Content generates here -->
                        </div>

                        <!-- Preloader for infinite scroll -->
                        <div class="infinite-scroll-preloader wastes-tab">
                          <div class="preloader"></div>
                        </div>
                      </div>
                    </swiper-slide>



                </swiper-container>
            </div>
        </div>

        <div class="popup links-popup three-quarter-popup">
            <div class="view">
                <div class="page">
                    <div class="navbar">
                        <div class="navbar-inner">
                            <div class="title">More Links</div>
                            <div class="right">
                                <!-- Link to close popup -->
                                <a class="link popup-close"><i class="icon f7-icons">xmark</i></a>
                            </div>
                        </div>
                    </div>
                    <div class="page-content">
                        <div class="block profile-external-links">
                            <div class="list links-list list-outline-ios list-strong-ios list-dividers-ios">
                                <ul>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
Array
(
    [div] => Array
        (
            [class] => Array
                (
                    [0] => page
                    [1] => navbar
                    [2] => navbar-bg
                    [3] => navbar-inner
                    [4] => left
                    [5] => middle
                    [6] => header-logo
                    [7] => right
                    [8] => page-content profile-landing-page infinite-scroll-content view-page ptr-content ptr-watch-scrollable
                    [9] => ptr-preloader
                    [10] => preloader
                    [11] => ptr-arrow
                    [12] => loading-fullscreen
                    [13] => preloader preloader-central
                    [14] => profile-background
                    [15] => profile-head
                    [16] => profile-image
                    [17] => skeleton-block
                    [18] => skeleton-block
                    [19] => mt-1
                    [20] => btn w-70 bg-dark user-follow-btn
                    [21] => skeleton-block
                    [22] => profile-links
                    [23] => profile-links-external d-flex
                    [24] => profile-lower
                    [25] => profile-tabs
                    [26] => swiper-inner-container
                    [27] => profile-grid list virtual-list
                    [28] => infinite-scroll-preloader posts-tab view-profile
                    [29] => preloader
                    [30] => swiper-inner-container
                    [31] => profile-grid
                    [32] => infinite-scroll-preloader wastes-tab
                    [33] => preloader
                    [34] => popup links-popup three-quarter-popup
                    [35] => view
                    [36] => page
                    [37] => navbar
                    [38] => navbar-inner
                    [39] => title
                    [40] => right
                    [41] => page-content
                    [42] => block profile-external-links
                    [43] => list links-list list-outline-ios list-strong-ios list-dividers-ios
                )

            [data-name] => Array
                (
                    [0] => profile-view
                )

            [data-infinite-distance] => Array
                (
                    [0] => 50
                )

            [data-ptr-distance] => Array
                (
                    [0] => 130
                )

            [style] => Array
                (
                    [0] => background-color:gray;
                    [1] => background-color:gray;
                    [2] => width: 100px
                    [3] => width: 100px
                    [4] => width: 80px
                )

            [id] => Array
                (
                    [0] => profile-view-grid-posts
                    [1] => profile-grid-wastes
                )

        )

    [a] => Array
        (
            [class] => Array
                (
                    [0] => link back
                    [1] => profile-link social-link link external
                    [2] => profile-link social-link link external
                    [3] => profile-link social-link link external
                    [4] => profile-link social-link link external
                    [5] => profile-link social-link popup-open
                    [6] => tab-link
                    [7] => tab-link
                    [8] => link popup-close
                )

            [id] => Array
                (
                    [0] => instagram
                    [1] => facebook
                    [2] => tiktok
                    [3] => youtube
                    [4] => my-posts
                    [5] => my-wastes
                )

            [target] => Array
                (
                    [0] => _blank
                    [1] => _blank
                    [2] => _blank
                    [3] => _blank
                )

            [href] => Array
                (
                    [0] => https://www.instagram.com/
                    [1] => https://www.facebook.com
                    [2] => https://www.tiktok.com
                    [3] => https://www.youtube.com
                    [4] => #profileview-posts-tab
                    [5] => #profileview-wastes-tab
                )

            [style] => Array
                (
                    [0] => display: none;
                )

            [display] => Array
                (
                    [0] => none
                )

            [data-popup] => Array
                (
                    [0] => .links-popup
                )

        )

)
Add JS Function Name