背景

1. 数组排序方法有很多种，我遇到一个场景没办法简单通过数组的sort排序，于是另辟蹊径通过css的属性进行排序。
2. 实现了聊天场景中，最新一条消息排在列表最上方的需求。当有一条新消息收到时，该条数据回上升到列表最上方。
3. 其他场景中遇到数据更新时也可以用该方法。
   

实现

<template>
  <view class="content" style="padding: 10upx 5upx;">
       <view class="message-list">
		   <view v-for="(item,i) of userList" :key="i"  @click="goChat(item)" :style="{'order':~privateMassagerTips[item.id].time}">		   
				<wkiwi-swipe-action 
				:options="options" 
				:url="item.figureurl" 
				:disabled="item.disabled"
				:stick="item.stick"
				 type="2"
				:count= "privateMassagerTips[item.id].count"
				:message="privateMassagerTips[item.id].content"
				:time="privateMassagerTips[item.id].time"
				:title="item.nickname"
				 ></wkiwi-swipe-action>
		   </view>  
    </view>
  </view>
</template>

注：~privateMassagerTips[item.id].time} 获取的是数据的更新时间，‘~’取负数。

.message-list{
	padding-top: 5upx;
	display: flex;
	flex-direction: column;
}

结论

感觉效果不错，在我的业务中可能会比js排序效率高一些。给大家提供参考