Blame view

src/views/demo/comp/scroll/index.vue 897 Bytes
陈文彬 authored
1
<template>
2
  <PageWrapper title="滚动组件示例" content="基于el-scrollbar">
3
    <div class="scroll-wrap">
陈文彬 authored
4
5
6
      <ScrollContainer class="mt-4">
        <ul class="p-3">
          <template v-for="index in 100" :key="index">
7
            <li class="p-2" :style="{ border: '1px solid #eee' }">{{ index }}</li>
陈文彬 authored
8
9
10
11
          </template>
        </ul>
      </ScrollContainer>
    </div>
12
  </PageWrapper>
陈文彬 authored
13
14
15
16
17
</template>
<script lang="ts">
  import { defineComponent } from 'vue';
  import { CollapseContainer } from '/@/components/Container/index';
  import { ScrollContainer } from '/@/components/Container/index';
18
19
  import { PageWrapper } from '/@/components/Page';
陈文彬 authored
20
  export default defineComponent({
21
    components: { CollapseContainer, ScrollContainer, PageWrapper },
陈文彬 authored
22
23
  });
</script>
24
25
26
27
28
29
30
<style lang="less" scoped>
  .scroll-wrap {
    width: 50%;
    height: 300px;
    background: #fff;
  }
</style>