<template>
  <div class="kole-infinitescroll kole-infinitescroll-scroll" :style="{ height: height }" role="feed"><div class="kole-infinitescroll-scroll-item">活动记录 1</div><div class="kole-infinitescroll-scroll-item">活动记录 2</div><button class="kole-infinitescroll-button" type="button" :disabled="loading || status === 'done'" @click="$emit('load')">{{ loading ? '加载中…' : status === 'done' ? '已全部加载' : '加载更多' }}</button></div>
</template>

<script>
export default {
  name: 'KoleInfiniteScroll',
  props: {
    items: { type: Array, default: function () { return []; } }, // 数据项
    loading: { type: Boolean, default: false }, // 是否加载中
    status: { type: String, default: 'more' }, // 状态
    height: { type: String, default: '180px' }, // 高度
  },
  // events: load
};
</script>

<style src="./InfiniteScroll.css"></style>
