vue项目微信回退按钮处理
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name='viewport' content='width=device-width, initial-scale=1.0, user-scalable=no'/>
<meta name="MobileOptimized" content="360"/>
<style>
html{font-size: calc(100vw / 3.75)}
body,html{
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
body{
font-size: 14px;
background: rgba(251,251,253,1);
color: #000;
font-family:"PingFang SC","microsoft yahei";
}
.flex{display:flex;display:-webkit-flex;}
.jc-center{justify-content:center;-webkit-justify-content:center;}
.ai-center{align-items:center;-webkit-align-items:center;}
.fd-column{flex-direction:column;-webkit-flex-direction:column;}
.noActivity{
height: 100%;
text-align: center;
}
.noAcitivityMain{
height: 90%;
color: #4D5061;
}
.noAcitivityMain img{
width: 1.8rem;
max-width: 249px;
max-height: 249px;
}
.noAcitivityMain .notice{
margin-top: 3vh;
color: rgba(51,53,65,0.5);
}
</style>
</head>
<body>
<div class="noActivity relative" id="succOrder">
<div class="noAcitivityMain flex ai-center jc-center fd-column">
<img src="img/succOrder.png" alt="" />
<div class="bold succorder">预约成功！</div>
<div>您已成功预约，</div>
<div>稍后我们会推送给您预约成功的消息</div>
</div>
</div>
<script src="js/vue.min.js"></script>
<script>
vm = new Vue({
el: '#succOrder',
data:{
},
mounted(){
//监测回退
history.pushState(null, null, document.URL)
window.addEventListener('popstate', this.forbidback);
},
beforeDestroy(){
//销毁
window.removeEventListener('popstate',this.forbidback);
},
methods: {
forbidback(){
//回退按钮点击处理
alert('kkkk');
}
}
})
</script>
</body>
</html>
vue项目微信回退按钮处理的更多相关文章
- vue项目微信分享之后路由链接被破坏怎么办
异常现象: 多页面应用,路由采用hash模式,链接带有"#". 在微信中分享到朋友圈或好友时,分享出去的路由被破坏,打开分享的链接,路由中的“#”会被去掉并追加?fromTimel ...
- 直击--vue项目微信小程序页面跳转web-view不刷新-根源
背景 最近项目需要适配小程序,项目是使用了vue开发的网站,其中改造方式是,每个页面都使用小程序创建一个页面通过web-view来显示指定页面的. 在没有使用小程序时,路由跳转时,刷新页面等等,这个是 ...
- vue 项目如何使用微信分享接口
首先做微信网页都要接入微信sdk: 安装sdk npm install weixin-js-sdk --save 具体可以查看微信公众平台技术文档:https://mp.weixin.qq.com/w ...
- vue项目中微信jssdk在ios签名失败
一.问题描述 1. vue项目中微信jssdk签名时,在安卓和ios是有差异的,签名时使用的url=window.location.href.split('#')[0],此时在安卓没问题,在ios会导 ...
- Vue项目history模式下微信分享总结
原文 : http://justyeh.top/post/39/ 2019-07-02 Vue微信分享 每回遇到微信分享都是一个坑,目前的商城项目使用Vue开发,采用history的路由模式,配置微信 ...
- 解决关于 vue项目中 点击按钮路由多了个问号
问题描述: 在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的 ...
- vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟，连续点击无反应的问题
异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...
- 解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
最近开发的微信公众号项目中(项目采用Vue + Vux 构建,站点部署在IIS8.5上),遇到个非常奇葩的问题,发布站点内容后,通过微信打开网址发现是空白页面(后来验证是微信浏览器缓存了入口文件-in ...
- 21、解决关于 vue项目中 点击按钮路由多了个问号
在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的默认事件,就 ...
随机推荐
- 没有Home键之后的iPhone会是什么样子？
以下内容由Mockplus团队翻译整理,仅供学习交流,Mockplus是更快更简单的原型设计工具. 之前笔者推测新一代的iPhone不会再有“Home”键.果不其然,9月13日苹果发布会证实了笔者的观 ...
- webform版部分视图与请求拦截
.主控前台页面 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebFor ...
- Kubernetes 中的pv和pvc
原文地址:http://www.cnblogs.com/leidaxia/p/6485646.html 持久卷 PersistentVolumes 本文描述了 Kubernetes 中的 Persis ...
- .NET基础 （11）类型的基类System.Object
类型的基类System.Object1 是否存在不继承自System.Object类型的类2 在System.Object中定义的三个比较方法有何异同3 如何重写GetHashCode方法 类型的基类 ...
- ZOJ3708:Density of Power Network
The vast power system is the most complicated man-made system and the greatest engineering innovatio ...
- [编译，报错以及其他] 有关C/C++中int不能用-2147483648当最小值的问题
这个取决于今早看耗子叔的微博: 这里说到了int的取值范围的问题,int的取值是-2147483648 ~ 2147483647,但是如果直接在编译器(VS2013)中使用-2147483648会报错 ...
- EAS.Net 在程序里配置组件
public class BeforStart { /// <summary> /// 程序配置初始化 /// </summary> public static void EA ...
- VMware虚拟机无法启动，提示“无法打开磁盘，未能锁定文件”
VMware在进入linux时,提示:无法打开磁盘 F:\Debian\Debian linux2.6.x kernel.vmdk 或者某一个快照所依赖的磁盘原因: 未能锁定文件 问题出现的原因:虚拟 ...
- ANE-如何加入ane，调试时又不报错
有时候我们加入ane,即使没有调用ane的功能,debug的时候也会报错无法调试,这是为什么呢?因为我们的ane没有把default包含进去. 首先我们的extension.xml要把default节 ...
- 比特币的TxHash为什么会发生改变
比特币中TxHash为什么会变化? 一直不理解比特币的Tx在被打包确认之前TxHash为什么会发生变化,这次终于找到了依据. 交易可延展性 虽然交易签名后,签名当前不会覆盖经过哈希处理以创建事务哈希的 ...