mirror of
https://github.com/element-plus/element-plus.git
synced 2025-08-15 03:06:25 +08:00
f78407a409
* fix(components): empty icon component judgment * revert: globals components * fix(components): el-icon missing import * fix: use shallowRef for icon components * refactor: remove shallowRef * fix: remove unused code * fix: social-link icon size * fix: time picker icon * fix: v-if judge
60 lines
1.3 KiB
Vue
60 lines
1.3 KiB
Vue
<template>
|
|
<div class="block">
|
|
<el-timeline>
|
|
<el-timeline-item
|
|
v-for="(activity, index) in activities"
|
|
:key="index"
|
|
:icon="activity.icon"
|
|
:type="activity.type"
|
|
:color="activity.color"
|
|
:size="activity.size"
|
|
:hollow="activity.hollow"
|
|
:timestamp="activity.timestamp"
|
|
>
|
|
{{ activity.content }}
|
|
</el-timeline-item>
|
|
</el-timeline>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent } from 'vue'
|
|
import { MoreFilled } from '@element-plus/icons'
|
|
|
|
export default defineComponent({
|
|
setup() {
|
|
return {
|
|
activities: [
|
|
{
|
|
content: 'Custom icon',
|
|
timestamp: '2018-04-12 20:46',
|
|
size: 'large',
|
|
type: 'primary',
|
|
icon: MoreFilled,
|
|
},
|
|
{
|
|
content: 'Custom color',
|
|
timestamp: '2018-04-03 20:46',
|
|
color: '#0bbd87',
|
|
},
|
|
{
|
|
content: 'Custom size',
|
|
timestamp: '2018-04-03 20:46',
|
|
size: 'large',
|
|
},
|
|
{
|
|
content: 'Custom hollow',
|
|
timestamp: '2018-04-03 20:46',
|
|
type: 'primary',
|
|
hollow: true,
|
|
},
|
|
{
|
|
content: 'Default node',
|
|
timestamp: '2018-04-03 20:46',
|
|
},
|
|
],
|
|
}
|
|
},
|
|
})
|
|
</script>
|