微信浏览器 代理服务器,打开App:微信浏览器内部打开app跳转

思考是否是兼容的问题：

线索：苹果手机可以正常显示“打开App”字样，只有安卓机型不显示。所以初步判定是兼容的问题，但是另一个banner上的“打开App”可以正常显示，所以这个标签本身对安卓是不过敏的，因此我认为不显示和弹框有很大的关系。

排查步骤： 是否是Dom层的问题：因此我去掉了微信标签，换成了原来的按钮html,

现在的结果是：按钮显示出来了，文字也显示了。完成✅

进行下一步：让按钮上的文字能有正常的显示样式。完成✅

进行第4步：将微信标签加到Dom中。观察按钮是否还在。❌完全不显示了

5,排查一下是否是标签外部没加view导致的。因此我在标签外部加了view,并且给了这个view宽度以及高度和背景颜色。❌即使外部的框显示出来了，内部的也没有显示。

我将没有问题的代码直接复制过来了，看看会不会出错。❌我已经试了所有的可能性，还是没出现这个按钮！！！我绝望了

也许是z-index 的问题吗？好像就是❌，并不是的。

终于发现了问题，这个微信标签是不可以和position :

fixed一起用的。我的弹框的样式都是用固定定位写的，因此出了问题。那么，我写在外面可不可以呢？？试一下吧：我将标签按钮写在了position:fixed的外面。答案是：可以的。✅

在网上：微信开放平台的问答区找到了合适的方法。将这个标签的定位定在弹框的确认按钮上，然后将这个按钮设为完全透明，这样用户点击时，实际上触法的是覆盖在弹框上的透明按钮。✅

这里要注意的点是：微信标签的按钮宽高样式不支持rpx，使用px就好。还有覆盖层级z-index要注意。

最后一步了，现在安卓手机的兼容问题已经解决了大部分。安卓上按钮可以点击了。但是：按钮不可以和v-show一起用！！！这样的问题就是：按钮会一直存在于页面上，不会和弹框一起消失，一起出现！！现在还没解决这个问题！！

✅终于解决了这个问题：v-show会让按钮在安卓机上不显示呢，换成v-if就可以了。 ⛽️

完成啦！！！

代码会在下一篇文章中贴出来。