哈哈哈,昨天登QQ的时候,意外发现有人看了我写的博客,居然还加了我,这就激起了我内心的小波澜啊

公司最近在做电商,用的前端框架依然是VUE

矩MAX(微信公众号)可以搜的到哦,安卓商店或苹果AppStore也可以搜的到

回归中体哈,说一下今天做的领券中心

有点类似于京东的领券中心,刚测试完,券全被我领啦

效果就是点击立即领取,文字变为立即使用、弹出领取成功

但是因为接口不是实时的,所以我没有通过接口数据判断让用户点击领取的同时,让优惠券改变状态

但是,毛爷爷说过:办法总比困难多~

当领取成功后,页面会重新走一遍获取优惠券的接口

所以  我写了一个时间函数setTimeout

通过this.$el.querySelector("#coupon_list").children[this.currentNum].offsetTop获取当前 点击的元素的offsetTop值

当领取成功之后,页面回跳至 该元素的原位置

vue中,在不方便使用ref来改变的时候咱们可以通过原生js来修改元素的属性样式

嗯 好吧  ,就说这些废话吧

我是菜鸟

如果你觉得我写的很垃圾,欢迎批评指正

vue 页面滚动到原位置的更多相关文章

  1. 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  2. 微信小程序(13)--页面滚动到某个位置添加类效果

    微信小程序页面滚动到某个位置添加类,盒子置顶效果. <!-- vh,是指CSS中相对长度单位,表示相对视口高度(Viewport Height),1vh = % * 视口高度 --> &l ...

  3. 【特效】页面滚动到相应位置运行css3动画

    请到我的个人博客网站上浏览此文章,欢迎评论和建议. 文章链接:http://www.xiaoxianworld.com/archives/87 现在css3动画很常见了,实际项目中经常应用,特别是那种 ...

  4. js 页面滚动到指定位置

    当页面的长度比较长时,如果进行刷新页面,我们希望能够在刷新完成页面之后,能够停留在当前位置,而不是从头再手动滚动到当前位置. 那么这样的效果如何实现呢?下面开始简单描写(由于博客园不支持效果展示,所以 ...

  5. 每天一点点之 uni-app 框架开发 - 页面滚动到指定位置

    项目需求:在页面中,不管位于何处,点击评论按钮页面滚动到对应到位置 实现思路如下: uni.createSelectorQuery().select(".comment").bou ...

  6. 微信小程序页面滚动到指定位置

    页面上有一个元素或者组件,id 为 comment 则: var me = this; var query = wx.createSelectorQuery().in(me); query.selec ...

  7. vue+vux页面滚动定位(支持上下滑动)

    接上篇文章:https://www.cnblogs.com/ligulalei/p/10622778.html在上篇文章中实现了通过使用scrollIntoView()在使用vux的移动端实现了点击锚 ...

  8. ASP.Net页面刷新后自动滚动到原来位置

    在网上搜索之后总结了三种方式: 1.设置Page中的MaintainScrollPositionOnPostback属性为true A>.页面里有MaintainScrollPositionOn ...

  9. js实现一个长页面中的图片懒加载即滚动到其位置才加载

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. 松软科技课堂:SQL--RIGHTJOIN关键字

    发布时间:2019/3/15 9:27:31 SQL RIGHT JOIN 关键字 RIGHT JOIN 关键字会右表 (table_name2) 那里返回所有的行,即使在左表 (table_name ...

  2. python里面的xlrd模块详解

    那我就一下面积个问题对xlrd模块进行学习一下: 1.什么是xlrd模块? 2.为什么使用xlrd模块? 3.怎样使用xlrd模块? 1.什么是xlrd模块? ♦python操作excel主要用到xl ...

  3. 01.Django基础一之web框架的本质

    一 web框架的本质及自定义web框架 我们可以这样理解:所有的Web应用本质上就是一个socket服务端,而用户的浏览器就是一个socket客户端,基于请求做出响应,客户都先请求,服务端做出对应的响 ...

  4. 使用spring拦截器实现日志管理

    使用HandlerInterceptor拦截器,可以拦截请求,实现通用的日志管理操作 一.添加拦截器类 在"src/main/java"代码文件夹的"org.xs.dem ...

  5. Exceptionless 5.0.0 本地Docker快速部署介绍

    在之前我有专门写两篇文章介绍过Exceptionless这款开源日志项目的使用和部署,但是当时是基于4.1.0版本(2017年的release),时隔两年多Exceptionless也推出了5.0.0 ...

  6. css实现斜角效果

    重点代码: 使用一张图片盖住div,实现斜角效果 .triangle { position: absolute; top:; left:; width: 36px; height: 36px; bac ...

  7. Spring只定义接口自动代理接口实现类

    能够扫描到包 @ComponentScan("org.zxp.esclientrhl") ESCRegistrar类主要实现ImportBeanDefinitionRegistra ...

  8. VR应用评测 - Apollo 11 阿波罗11号

    Apollo 11 VR http://store.steampowered.com/app/457860/Apollo_11_VR/ Steam VR 2016年发布 好评率 50% 基于美国航空航 ...

  9. Scala 学习笔记之函数(1)

    class Student { val mySayHello1: String => Unit = sayHello val mySayHello2: (String, Int) => U ...

  10. MySQL8安装及使用当中的一些注意事项

    前言 这两天构建新项目,在本地安装的mysql8(本地环境windows),期间忘了密码,又卸载重装了一番,然后捣鼓了一顿授权给别人访问,最后磕磕绊绊的搞好了,下面是在这过程中遇到的问题及解决办法小结 ...