1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
| <template>
| <div class="art-card h-128 p-5 mb-5 max-sm:mb-4">
| <div class="art-card-header">
| <div class="title">
| <h4>动态</h4>
| <p>新增<span class="text-success">+6</span></p>
| </div>
| </div>
|
| <div class="h-9/10 mt-2 overflow-hidden">
| <ElScrollbar>
| <div
| class="h-17.5 leading-17.5 border-b border-g-300 text-sm overflow-hidden last:border-b-0"
| v-for="(item, index) in list"
| :key="index"
| >
| <span class="text-g-800 font-medium">{{ item.username }}</span>
| <span class="mx-2 text-g-600">{{ item.type }}</span>
| <span class="text-theme">{{ item.target }}</span>
| </div>
| </ElScrollbar>
| </div>
| </div>
| </template>
|
| <script setup>
| const list = reactive([
| {
| username: '中小鱼',
| type: '关注了',
| target: '誶誶淰'
| },
| {
| username: '何小荷',
| type: '发表文章',
| target: 'Vue3 + JavaScript + Vite 项目实战笔记'
| },
| {
| username: '中小鱼',
| type: '关注了',
| target: '誶誶淰'
| },
| {
| username: '何小荷',
| type: '发表文章',
| target: 'Vue3 + JavaScript + Vite 项目实战笔记'
| },
| {
| username: '誶誶淰',
| type: '提出问题',
| target: '主题可以配置吗'
| },
| {
| username: '发呆草',
| type: '兑换了物品',
| target: '《奇特的一生》'
| },
| {
| username: '甜筒',
| type: '关闭了问题',
| target: '发呆草'
| },
| {
| username: '冷月呆呆',
| type: '兑换了物品',
| target: '《高效人士的七个习惯》'
| }
| ])
| </script>
|
|
