fix pages swiping
This commit is contained in:
parent
d5fbd8ca0c
commit
1d0fcee862
3 changed files with 14 additions and 3 deletions
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "calckey",
|
"name": "calckey",
|
||||||
"version": "12.119.0-calc.12.9",
|
"version": "12.119.0-calc.12.10",
|
||||||
"codename": "aqua",
|
"codename": "aqua",
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed, watch } from 'vue';
|
import { computed, watch, onMounted } from 'vue';
|
||||||
import { Virtual } from 'swiper';
|
import { Virtual } from 'swiper';
|
||||||
import { Swiper, SwiperSlide } from 'swiper/vue';
|
import { Swiper, SwiperSlide } from 'swiper/vue';
|
||||||
import XFeatured from './explore.featured.vue';
|
import XFeatured from './explore.featured.vue';
|
||||||
|
@ -118,4 +118,8 @@ function syncSlide(index) {
|
||||||
swiperRef.slideTo(index);
|
swiperRef.slideTo(index);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
syncSlide(tabs.indexOf(swiperRef.activeIndex));
|
||||||
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed, inject } from 'vue';
|
import { computed, watch, onMounted } from 'vue';
|
||||||
import { Virtual } from 'swiper';
|
import { Virtual } from 'swiper';
|
||||||
import { Swiper, SwiperSlide } from 'swiper/vue';
|
import { Swiper, SwiperSlide } from 'swiper/vue';
|
||||||
import MkPagePreview from '@/components/MkPagePreview.vue';
|
import MkPagePreview from '@/components/MkPagePreview.vue';
|
||||||
|
@ -56,6 +56,7 @@ const router = useRouter();
|
||||||
|
|
||||||
let tab = $ref('featured');
|
let tab = $ref('featured');
|
||||||
const tabs = ['featured', 'my', 'liked'];
|
const tabs = ['featured', 'my', 'liked'];
|
||||||
|
watch($$(tab), () => (syncSlide(tabs.indexOf(tab))));
|
||||||
|
|
||||||
const featuredPagesPagination = {
|
const featuredPagesPagination = {
|
||||||
endpoint: 'pages/featured' as const,
|
endpoint: 'pages/featured' as const,
|
||||||
|
@ -101,6 +102,8 @@ definePageMetadata(computed(() => ({
|
||||||
|
|
||||||
let swiperRef = null;
|
let swiperRef = null;
|
||||||
|
|
||||||
|
let swiperRef = null;
|
||||||
|
|
||||||
function setSwiperRef(swiper) {
|
function setSwiperRef(swiper) {
|
||||||
swiperRef = swiper;
|
swiperRef = swiper;
|
||||||
syncSlide(tabs.indexOf(tab));
|
syncSlide(tabs.indexOf(tab));
|
||||||
|
@ -113,6 +116,10 @@ function onSlideChange() {
|
||||||
function syncSlide(index) {
|
function syncSlide(index) {
|
||||||
swiperRef.slideTo(index);
|
swiperRef.slideTo(index);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
syncSlide(tabs.indexOf(swiperRef.activeIndex));
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
Loading…
Reference in a new issue