<template>
    <ul class="base-list">
        <div v-if="loading">加载中...</div>
        <li
            class="list-item"
            v-for="(item, index) in items"
            :key="index"
        >
            <slot v-bind="item"></slot>
        </li>
    </ul>
</template>
<script>
import { to } from '@/utils/awaitTo'

export default {
    props: {
        apiFn: {
            type: Function,
            required: true,
        },
    },
    data() {
        return {
            items: [],
            loading: false,
        }
    },
    created() {
        this.getList()
    },
    methods: {
        async getList() {
            this.loading = true
            const [err, res] = await to(
                this.apiFn({
                    page: 1,
                    limit: 999999,
                })
            )
            this.loading = false
            if (err) {
                return Promise.reject()
            }
            this.items = res.rows
        },
    },
}
</script>
<style scoped></style>
