更新记录

1.0(2025-01-07) 下载此版本

第一版发布


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
app-vue app-nvue ×
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

新闻资讯列表详情页面模板


使用说明:

将pages文件夹下index、details文件复制至自己的项目内即可。
详情页内使用了官方icon插件,请注意一同下载:uni-icons 图标 - DCloud 插件市场

列表页

newsData

字段名 类型 说明
id Number
title String 文章标题
medium String 媒体名称
time String 发布时间
image Array 图片

methods

函数名 说明
getNewsData 获取列表数据
toDetails 跳转至详情页

页面布局

列表页共四种布局样式:标题(无图)、单图、双图、三图。这里会根据image数组长度判断,无需其他逻辑接入。
也就是说,无论有无图片或是几张图片,image都应是一个数组。


详情页

details

字段名 类型 说明
id Number
title String 文章标题
medium String 媒体名称
time String 发布时间
pageviewNum Number 浏览量
html String 文章的富文本内容
likeNum Number 点赞数
collectNum Number 收藏数
commentNum Number 评论数
isLike Boolean 当前用户是否点赞
isCollect Boolean 当前用户是否收藏
commentData Array 评论列表

commentData

字段名 类型 说明
avatar String 头像
nickname String 昵称
content String 评论内容
location String ip定位
time String 发布时间

methods

函数名 说明
getNewsDetails 获取详情数据
like 点赞\取消点赞
collect 收藏\取消收藏
share 分享
sendComment 发送评论
scrollToTop 滚动页面至顶部
scrollToComment 滚动页面至评论位置

页面示例预览

fl-template-news.png

https://static-mp-55b3cd3b-8c2c-4c73-bad5-d78291945fa2.next.bspapp.com/fl-template-news

其他

关于广告:开源不易,生活不易,广告下载,实属无奈,理解万岁。
我将陆续推出其他项目及页面模板,旨在方便大家的开发工作。

End...

Good luck for us

© Created by Finley

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问