54 lines
970 B
TypeScript
54 lines
970 B
TypeScript
import { ref, onMounted } from "vue"
|
|
|
|
type OptionValue = string | number
|
|
|
|
/** Select 需要的数据格式 */
|
|
interface SelectOption {
|
|
value: OptionValue
|
|
label: string
|
|
disabled?: boolean
|
|
}
|
|
|
|
/** 接口响应格式 */
|
|
interface ApiData {
|
|
code: number
|
|
data: SelectOption[]
|
|
message: string
|
|
}
|
|
|
|
/** 入参格式，暂时只需要传递 api 函数即可 */
|
|
interface FetchSelectProps {
|
|
api: () => Promise<ApiData>
|
|
}
|
|
|
|
export function useFetchSelect(props: FetchSelectProps) {
|
|
const { api } = props
|
|
|
|
const loading = ref<boolean>(false)
|
|
const options = ref<SelectOption[]>([])
|
|
const value = ref<OptionValue>("")
|
|
|
|
/** 调用接口获取数据 */
|
|
const loadData = () => {
|
|
loading.value = true
|
|
options.value = []
|
|
api()
|
|
.then((res) => {
|
|
options.value = res.data
|
|
})
|
|
.finally(() => {
|
|
loading.value = false
|
|
})
|
|
}
|
|
|
|
onMounted(() => {
|
|
loadData()
|
|
})
|
|
|
|
return {
|
|
loading,
|
|
options,
|
|
value
|
|
}
|
|
}
|