1.pc端实现移动端拖动效果思路
- moveDown
- 记录鼠标按下位置
- 记录当前状态为按下拖动
+moveUp - 记录当前状态为非拖动
- moseMove
- 根据拖动状态,计算当前拖动距离
- 判断左拖右拖边界值
- 对元素进行移动
- 修改鼠标按下位置,以便下次计算移动距离,不初始化会导致移动距离指数式增加,移动距离计算错误
- moseLeave
- 修改鼠标按下状态,离开拖动区域,将状态改为非拖动
- 鼠标移动事件
2.pc端点击,未展示全部图片,移动至中间位置
- 计算能够展示的小图个数
- 计算中间位置
- 计算点击图片相对移动区域的位置
- 判断是否需要移动至中间 => 条件为点击图片为中线右边的图片,根据相对位置来计算
- 计算需要移动距离
- 移动元素
3.零碎片段
- vue中props等值不能使用驼峰,由于浏览器会默认将属性名修改成全小写
- Vue中的computed属性是利用了 get实现
- 动态类名可以与普通类名共存
- 请求不在created执行/nuxt为服务端渲染框架 created及之前的生命周期会在服务端与客户端同时执行