#ページネーションにてページ選択後、投稿一覧の一番上にスクロールさせたい
ページネーションを押下されたら、
投稿の一番トップである、「投稿一覧」にスクロールされるようにしたいです。
現状は、投稿自体は「3列x4行」計12つの投稿を1ページに表示させておりますが、
ページ選択後遷移は出来ておりますが、特にトップにスクロールされることない状態です。
その為、ページを選択・押下されたら「1列目x1行目」のトップまでスクロールさせたいと考えています。
methods: { postTop() { const postTop = document.getElementById(".post-tll"); const postTop_position = postTop.getBoundingClientRect(); window.scrollTo(0, postTop_position.top); },
js部コードとしては上記コードを記述しとおりますが、現状変化ない状態です。
分かる方いらっしゃいましたらお力添えを頂きたいです。
宜しくお願い致します。
#実際のコード
<template> <div> <Header /> <Post /> <div class="post"> <h2 class="post-tll neon">投稿一覧</h2> <div class="post-inner"> <div class="post-items"> <paginate name="paginate-log" tag="ol" :list="allData" :per="12"> <List v-for="(list, index) in paginated('paginate-log')" :index="index" :list="list" :key="list.id" /> </paginate> <paginate-links for="paginate-log" class="pagination flex" @click="postTop" :show-step-links="true" > </paginate-links> <!--allDataのデータをlist関数とindex関数にそれぞれ格納--> </div> </div> </div> </div> </template>
methods: { postTop() { const postTop = document.getElementById(".post-tll"); const postTop_position = postTop.getBoundingClientRect(); window.scrollTo(0, postTop_position.top); },
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。