<view v-for="(item,index) in messageList" :key="index">
<view class="img">
<image :src="item.img"></image>
</view>
<view class="content">
<view class="font-size-13">{{item.title}}</view>
<view class="font-size-min mt-1">
{{item.desc}}
</view>
</view>
<view class="time">
{{chatTimeFormat(item.time)}}
</view>
</view>
data() {
return {
messageList: [{
title: '',
time: 1712914451,
desc: '',
img: ''
},
{
title: '',
time: 1711964051,
desc: '',
img: ''
},
{
title: '',
time: 1713110400,
desc: '',
img: ''
},
{
title: '',
time: 1702200851,
desc: '',
img: ''
}
]
}
},
/**
* 聊天时间处理
* 当天:时分秒
* 本周:星期
* 本月:月日
* 本年:年月日
*/
chatTimeFormat(timeStamp, type) {
let nowDate = new Date(); //当前时间
let oldDate = new Date(timeStamp * 1000); //参数时间
let time = ''

// 获取本周的开始日期(周一)和结束日期(周日)
const startOfThisWeek = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate() - nowDate
.getDay() + 1);
const endOfThisWeek = new Date(startOfThisWeek.getFullYear(), startOfThisWeek.getMonth(), startOfThisWeek
.getDate() + 6, 23, 59, 59);
if (nowDate.toDateString() === oldDate.toDateString()) {
// 判断是否为当天
time = oldDate.format('hh:mm');
} else if (oldDate >= startOfThisWeek && oldDate <= endOfThisWeek) {
// 判断是否为本周
const weekdays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
time = weekdays[oldDate.getDay()];
} else if (nowDate.getMonth() === oldDate.getMonth()) {
// 判断是否为本月
time = oldDate.format('MM月dd日');
if ('-' === type) {
time = oldDate.format('MM-dd');
}
} else {
time = oldDate.format('yyyy年MM月dd日')
if ('-' === type) {
time = oldDate.format('yyyy-MM-dd')
}
}
return time
}
效果图: