function setScroll() {
scroll = new BScroll(storeListRef.value, {
bounce: false,
mouseWheel: true,
scrollY: true,
scrollbar: true,
// observeDOM: true
});
}
使用
watch(
() => mapClickIndex.value,
val => {
if (val != null) {
if (isShowDetail.value) {
handleBack();
nextTick(() => {
scroll.scrollToElement(`#storeListItem${val}`, 300);
});
} else {
scroll.scrollToElement(`#storeListItem${val}`, 300);
}
}
}
);
全局loading
组件
<!--
* @Desc:
-->
<template>
<van-overlay class="loading-page" :show="loading" :z-index="9">
<van-loading color="#1989fa" />
</van-overlay>
</template>
<script setup>
import { Loading as VanLoading, Overlay as VanOverlay } from "vant";
const props = defineProps({
loading: {
type: Boolean,
required: true,
},
});
</script>
<style lang="less" scoped>
.loading-page {
display: flex;
justify-content: center;
align-items: center;
}
</style>
main.js 注册
import PageLoading from "./components/PageLoading/index.vue";
const app = createApp(App); // 通过 createApp 初始化 app
app.component("PageLoading", PageLoading);
使用
<PageLoading :loading="pageLoading" />
pageLoading = ref(false),
/**
* @description: 进行自动登录
* @return {*}
*/
function doAutoLogin() {
pageLoading.value = true;
console.log("auto-login");
apiAutoLogin()
.then(res => {
hanldeLoginData(res);
})
.finally(() => {
pageLoading.value = false;
});
}