第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

vue頁(yè)面添加回到頂部的功能

vue頁(yè)面添加回到頂部的功能

ibeautiful 2019-02-06 13:42:54
vue項(xiàng)目中,有好多頁(yè)面需要添加回到頂部的功能,能不能做一個(gè)組件或者指令,可以在好多頁(yè)面中重復(fù)使用。引用的時(shí)候能傳參更好(設(shè)置距離底部的高度)。我自己做了一個(gè)組件,scroll組件標(biāo)簽像一個(gè)僅次于body標(biāo)簽的大容器,把頁(yè)面所要展現(xiàn)的內(nèi)容包含了起來(lái),感覺這樣不太合適。如下圖所示ps:回到頂部功能只是一個(gè)按鈕,一頁(yè)內(nèi)容加載不完,滑動(dòng)到底部的時(shí)候就會(huì)顯示,平時(shí)是不顯示的,如下圖所示:
查看完整描述

1 回答

?
MMMHUHU

TA貢獻(xiàn)1834條經(jīng)驗(yàn) 獲得超8個(gè)贊

感覺你要的是這樣的

   <template>

        <div class="scrollTop" @click="toTop">

            ...

        </div>

    </template>

    <script>

        export default {

            name: 'scroll-top',

            props: {

                toBottom: {

                    type: Number,

                    default: 0

                }

            },

            methods: {

                toTop() {

                    document.documentElement.scrollTop = document.body.scrollTop = 0;

                }

            },

            mounted() {

                document.querySelector('.scrollTop').style.bottom = this.toBottom;

            }

        }

    </script>

    <style scoped>

        .scrollTop {

            display: fixed;

            ...

        }

    </style>


查看完整回答
反對(duì) 回復(fù) 2019-02-15
  • 1 回答
  • 0 關(guān)注
  • 6669 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)