# Vueqr 依赖库中 未兼容 globalThis ,导致元素(绑带路由跳转)点击事件无效
# 描述
- vite + vue3 的多渠道(APP、小程序)嵌入H5项目
vueqr 库使用了 ES2020 的 globalThis 全局变量,但是有没有做兼容,导致低版本可能是Android Webview 60 版本以下的,提供不了这个变量,阻塞了跳转。
引入 vconsole 后开到报错,我就有过是 跳转的目标页面 报错了,所以无法跳转的想法,但是没有思路去验证。看到 globalThis 的报错,没有仔细的看报错的来源 awesomeqr ,依赖库里面没有该依赖,就没招了。
其实是 vueqr 本省 借鉴和使用了 awesomeqr 这个库,纯属于 依赖的依赖
# 解决方案
- 提供自定义的 globalThis 补丁(Polyfills),
- 在项目main.js 引入
import './utils/globalThisPolyfills.js' *// 兼容 globalThis*
// globalThisPolyfills.js
!(function (t) {
function e() {
var e = this || self;
(e.globalThis = e), delete t.prototype._T_;
}
'object' != typeof globalThis &&
(this
? e()
: (t.defineProperty(t.prototype, '_T_', {
configurable: !0,
get: e,
}),
_T_));
})(Object);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17