如何通过拖动实现商品列表的动态排序?

如何通过拖动实现商品列表的动态排序?

电商平台商品列表拖拽排序算法设计

电商网站中,用户可拖拽调整商品列表顺序的功能至关重要。本文针对分页前端和初始sort字段值为0的数据库商品列表,设计一种高效的排序算法,尽量避免修改添加和修改商品的现有操作。

我们的算法核心在于巧妙地利用数据库的sort字段,通过合理的数值分配和调整,实现动态排序。

一、初始化排序值:

首先,我们需要为每个商品分配一个初始的sort值。为了保证后续排序的灵活性,我们采用sql语句,为每个商品分配一个递增的排序值,并设置较大的间隙(例如1000),以避免排序值过于密集。

SET @sort := 0; UPDATE product SET sort = (@sort := @sort + 1000) ORDER BY id;

执行后,商品将按ID顺序排列,sort值依次为1000, 2000, 3000…

二、拖拽排序更新排序值:

用户拖拽商品时,我们需要更新其sort值。 具体方法是:计算目标位置前后两个商品sort值的中间值,并将该中间值赋予被拖拽商品。例如,将ID为3的商品(sort值为3000)拖动到ID为1和ID为2的商品之间:

原始排序:

id sort
1 1000
2 2000
3 3000

计算新sort值: 1000 + (2000 – 1000) / 2 = 1500

更新后排序:

id sort
1 1000
3 1500
2 2000

为了避免排序值过于均匀,可在计算中间值时加入少量随机数。

三、重新调整排序间隙:

经过多次拖拽后,sort值可能过于密集,影响后续排序。这时,我们需要重新调整间隙。 可以使用类似的sql语句,根据当前的sort值重新分配,保持一定的间隙(例如1000):

SET @sort := 0; UPDATE product SET sort = (@sort := @sort + 1000) ORDER BY sort;

此算法通过合理的sort值分配和调整,实现了高效的商品列表拖拽排序,并且最大限度地减少了对数据库操作的修改,保持了添加和修改商品操作的简洁性。 分页功能不会影响算法的有效性,因为算法只关注sort值的相对大小。

© 版权声明
THE END
喜欢就支持一下吧
点赞9 分享