element-plus 时间线左右布局，自定义本地图标

实现效果：

icon属性是放置组件库内置icon，与设计图出入很大，不美观。于是就在csdn搜索有没有自定义本地图标的方法，我看一了圈没有发现。花了点时间自己实现，然后放在csdn中帮助更多的打工人，也方便以后的自己。

icon属性还有另外一个类型，component，可以搭配h函数写一组img元素，就能实现自己想要的效果

<el-timeline  style="margin-left: 55px;">
<el-timeline-item
 v-for="(activity, index) in activities"
 :key="index"
 :type="activity.type"
 :color="activity.color"
 :size="activity.size"
 :hollow="activity.hollow"
 :timestamp="activity.timestamp"
 :icon="renderCustomIcon(activity.icon)"
>
<div class="timeLine-right">
    {{ activity.content }}
  </div>
</el-timeline-item>
</el-timeline>

<script setup>
/*
* { String } 本地图片路径
*/
const renderCustomIcon = (iconSrc) => {
 return h('img',{ src:iconSrc,class:'custom-icon' });
};
</script>
<style>
//时间线左右布局，不建议使用px直接设置偏移量，还是按照自己项目进行调整  
:deep(.el-timeline-item__timestamp) {
  position: absolute;
  left: -55px;
  top: -6px;
}
</style>