feat(projects): add alova examples (#647)

* feat: optimistic subpackage `@sa/alova`

* feat: add alova examples
This commit is contained in:
Scott Hu
2024-10-17 17:20:48 +08:00
committed by Soybean
parent 641f3160d6
commit a6545265ac
33 changed files with 1484 additions and 1 deletions

View File

@@ -0,0 +1,41 @@
<script setup lang="ts">
import { actionDelegationMiddleware, useAutoRequest } from '@sa/alova/client';
import { ref } from 'vue';
import { alova } from '@/serviceAlova/request';
const getLastTime = alova.Get<{ time: string }>('/mock/getLastTime', { cacheFor: null });
const isStop = ref(false);
const { loading, data } = useAutoRequest(getLastTime, {
pollingTime: 3000,
initialData: {
time: ''
},
async middleware(_, next) {
await actionDelegationMiddleware('autoRequest:3')(_, () => Promise.resolve());
if (!isStop.value) {
next();
}
}
});
const toggleStop = () => {
isStop.value = !isStop.value;
};
</script>
<template>
<NSpace vertical>
<NAlert type="info">
{{ $t('page.alova.scenes.pollingRequestTips') }}
</NAlert>
<NButton type="primary" @click="toggleStop">
<icon-carbon-play v-if="isStop" class="mr-2" />
<icon-carbon-stop v-else class="mr-2" />
{{ isStop ? $t('page.alova.scenes.startRequest') : $t('page.alova.scenes.stopRequest') }}
</NButton>
<NSpace align="center">
<span>{{ $t('page.alova.scenes.refreshTime') }}: {{ data.time || '--' }}</span>
<NSpin v-if="loading" :size="12" />
</NSpace>
</NSpace>
</template>