1.3.3 • Published 2 years ago

neumedia-article-list-item-m v1.3.3

Weekly downloads
55
License
-
Repository
-
Last release
2 years ago

移动端文章列表项

移动端H5页面文章列表项,单大图、左图右文、左文右图、三小图、纯标题。

本组件可配合其他组件使用。

更新历史

版本号作者更新记录更新时间
1.0.0huang.liang@neusoft.com初始版本2020.08.18

安装

npm install neumedia-article-list-item-m

导入

import ArticleListItemM from 'neumedia-article-list-item-m';

export default {
    components: {
        ArticleListItemM
    }
}

使用

<article-list-item-m
    type="left-image"
    title="提供多种图片填充模式,支持图片懒加载"
    image="http://tbwysx.cn/test/yaochun.jpeg"
    :gallery="[
        'http://tbwysx.cn/test/yaochun_1.jpeg',
        'http://tbwysx.cn/test/yaochun_2.jpeg',
        'http://tbwysx.cn/test/yaochun_3.jpeg'
    ]"
></article-list-item-m>

API

Props

说明说明类型默认值
type展示格式类型String'big-image'
title标题String''
image图片urlString''
gallery图集Array[]
max-title-line显示标题行数Number0
title-pos标题位置Stringup
image-cols图片宽度,总宽度为24Number8

type取值范围,展示格式类型

说明
big-image单张大图
left-image左图右文
right-image左文右图
gallery一行三图
text纯标题

title-pos 取值范围

说明
up标题在图片上(只对单张大图一行三图生效)
down标题在图片下(只对单张大图一行三图生效)
none隐藏标题(对除纯标题之外生效)

Slots

名称说明
image自定义封面图片
mask自定义封面图遮罩(只对大图、左图、右图生效,对三图不生效)<div style="position: absolute; top: 0; right: 0;">实现定位</div>
title-icon自定义标题前的小图标
left-extra左侧附加信息
right-extra右侧附加信息
1.3.3

2 years ago

1.3.2

2 years ago

1.3.1

2 years ago

1.2.9

2 years ago

1.2.8

3 years ago

1.2.7

3 years ago

1.2.6

3 years ago

1.2.5

3 years ago

1.2.4

3 years ago

1.2.3

3 years ago

1.2.0

3 years ago

1.2.2

3 years ago

1.2.1

3 years ago

1.1.0

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.3

4 years ago

1.0.0

4 years ago