<template>
<swiper class="swiper-box" @change="handleChange" :autoplay="false" :current="currentIndex"
:style="{ height: swiperHeight }">
<swiper-item>
<view class="swiper-item">
xxxxx
</view>
</swiper-item>
</swiper>
</template>
<script lang="ts" setup>
import { ref, reactive, nextTick, getCurrentInstance, onMounted } from "vue";
const instance = getCurrentInstance();
const currentIndex = ref<number>(0);
function getBoundingClientRect(selector: any, callback: any) { let query = uni.createSelectorQuery().in(instance); query .selectAll(selector) .boundingClientRect(data => { callback(data); }) .exec();}const handleChange = (e: any) => { console.log(e); if (e.detail) { currentIndex.value = e.detail.current; } else { currentIndex.value = e; } const element = `.swiper-item`; console.log(element); nextTick(() => { getBoundingClientRect(element, (data: any) => { console.log('高度', data); swiperHeight.value = data[currentIndex.value].height + 20 + 'px'; }); })}
</script>
希望对你有帮助!多交流