(component): 新增 timeline 组件 title 插槽

This commit is contained in:
就眠儀式 2022-09-09 00:42:20 +08:00
parent beff81863f
commit 6b8f0cc331
2 changed files with 11 additions and 8 deletions

View File

@ -19,16 +19,13 @@ const props = defineProps<LayTimelineItemProps>();
<template>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis" v-if="slot.dot">
<slot name="dot"></slot>
</i>
<i class="layui-icon layui-timeline-axis" v-else></i>
<i class="layui-icon layui-timeline-axis"><slot name="dot"></slot></i>
<div class="layui-timeline-content layui-text">
<div v-if="simple" class="layui-timeline-title">
{{ title }}
<slot name="title">{{ title }}</slot>
</div>
<h3 v-else class="layui-timeline-title">
{{ title }}
<slot name="title">{{ title }}</slot>
</h3>
<slot></slot>
</div>

View File

@ -14,7 +14,10 @@
<template>
<lay-timeline>
<lay-timeline-item title="8月18日">
<lay-timeline-item>
<template #title>
8月18日
</template>
<p>
layui vue 的一切准备工作似乎都已到位。发布之弦,一触即发。
<br>不枉近百个日日夜夜与之为伴。因小而大,因弱而强。
@ -121,7 +124,10 @@ export default {
<template>
<lay-timeline direction="horizontal">
<lay-timeline-item title="2015年" >2015年layui 孵化</lay-timeline-item>
<lay-timeline-item title="2016年" >2016年layui 首个版本发布</lay-timeline-item>
<lay-timeline-item >
<template #title>2016年</template>
2016年layui 首个版本发布
</lay-timeline-item>
<lay-timeline-item title="2017年" >layui里程碑版本1.0发布</lay-timeline-item>
<lay-timeline-item title="2021年" >layui里程碑版本2.0发布</lay-timeline-item>
</lay-timeline>