问题描述
今天, 用vue开发过程中遇到这样一个问题
- 需要拿到当前页面的 url中的一个id;
- 之后通过这个 id,将一个数组对象中和这个 id 相等的对象,放到数组对象索引为 0(最前面)的位置,其余元素保持原始位置。
解决问题
看到这个问题,我直接就想到了利用 loadsh 库中的_.sortBy()和_.isEqual()这两个方法来实现效果(对这两个方法不清楚的建议先去官网了解下)。如下代码:
let arrayList = [
{
id: "3106413879396148135",
name: "zm",
primary: false,
updateTime: "1970-01-02 08:00:00",
},
{
id: "3206413879496148135",
name: "zm1",
primary: true,
updateTime: "1970-01-03 08:00:00",
},
{
id: "3404413879396148135",
name: "zm2",
primary: false,
updateTime: "1970-01-04 08:00:00",
},
{
id: "3506413879392148135",
name: "zm3",
primary: true,
updateTime: "1970-01-05 08:00:00",
},
{
id: "3606413849396148135",
name: "zm4",
primary: true,
updateTime: "1970-01-06 08:00:00",
}
];
// let id = this.$route.query.id
let id = "3506413879392148135"; // 方便讲解,直接写死吧
arrayList = _.sortBy(arrayList, item => _.isEqual(item.id, id) ? 0 : 1);
- 结果:
- 描述:看_.sortBy()的第二个参数,它被称为“排序依据”,数组对象中的每个元素,都会去执行这个箭头函数,将每个元素的 id 和url 中取得的 id 对比,相等的话,返回 0,将该元素放到数组对象最前端;否则返回 1,保持原始位置不变。每个数组对象元素都会根据返回的"排序依据"去排序。