mirror of
https://github.com/element-plus/element-plus.git
synced 2024-11-21 01:02:59 +08:00
38 lines
745 B
Vue
38 lines
745 B
Vue
<template>
|
|
<el-button @click="add">Add Item</el-button>
|
|
<el-button @click="onDelete">Delete Item</el-button>
|
|
<el-scrollbar max-height="400px">
|
|
<p v-for="item in count" :key="item" class="scrollbar-demo-item">
|
|
{{ item }}
|
|
</p>
|
|
</el-scrollbar>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue'
|
|
const count = ref(3)
|
|
|
|
const add = () => {
|
|
count.value++
|
|
}
|
|
const onDelete = () => {
|
|
if (count.value > 0) {
|
|
count.value--
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.scrollbar-demo-item {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 50px;
|
|
margin: 10px;
|
|
text-align: center;
|
|
border-radius: 4px;
|
|
background: var(--el-color-primary-light-9);
|
|
color: var(--el-color-primary);
|
|
}
|
|
</style>
|