useAsyncState

useAsyncState 管理异步状态值

基础用法

<template>
  <div v-for="item in data" :key="item">
    {{ item }}
  </div>
  {{ loading ? "true" : "false" }}
  <button @click="() => {
    run();
  }">run</button>
</template>

<script lang="ts" setup>
import { useAsyncState } from "hooks-vue3";

const promise = () => {
  return new Promise((resolve) => {
    setTimeout(() => {
      console.log('setTimeout模拟请求');
      resolve([1, 2, 3]);
    }, 300);
  });
};
const { data, loading, run } = useAsyncState(() => promise(), {
  manual: true,
});
</script>

API

const { data, loading, run } = useAsyncState(() => promise(), {
  manual: true,
});

参数TS类型

import type { Ref } from 'vue';

function useBoolean (
  defaultBoolean = false,
): [state: Readonly<Ref<boolean>>, setTrue: () => void, setFalse: () => void]