使用到的库 html5-qrcode vant vant 实现代码 <template> <div> <van-dialog v-model:show="show" title="扫一扫" @close="closeDialog" :show-cancel-button="true" :show-confirm-button="false" > <div id="r…
使用到的库 html5-qrcode vant vant 实现代码 <template> <div> <van-dialog v-model:show="show" title="扫一扫" @close="closeDialog" :show-cancel-button="true" :show-confirm-button="false" > <div id="r…
vant4 的 Popup组件使用,会导致Toast组件样式发生变化,背景色变成白底 原因是:单独使用 Toast 组件,Toast 样式顶掉了Popup样式;如果使用了Popup组件,就会重新多添加一次Popup样式,就导致后添加的Popup样式顶掉了Toast样式,就造成样式冲突,Toast就变成白底了 解决方法: 在 基础css文件中,或者最外层css文件,强制 !important 样式为默认样式 /* vant4的 Toast 和 Popup 样式冲突,会导致 Toast 变成白底 */ .van-pop…
项目 vue3 vite element-plus 配置 安装 scss yarn add sass 准备定制化文件 在静态资源中创建:@/assets/styles/element.scss /* 只需要重写你需要的即可 */ @forward 'element-plus/theme-chalk/src/common/var.scss' with ( $colors: ('primary': ( // 主色 'base': #27ba9b, ), 'success': ( // 成功色 'base': #1dc7…
代码实现 uni-app vue3代码 // 缓存 const cacheSize = ref('0B') function getAppCache() { plus.cache.calculate(function (size) { //size是多少个字节单位是b //做下面相应的处理 if (size < 1024) { cacheSize.value = size + 'B' } else if (size / 1024 >= 1 && s…
import ToastUtil from "@/utils/ToastUtil"; /** * 场景。 * 可取值“WXSceneSession”分享到聊天界面,“WXSceneTimeline”分享到朋友圈,“WXSceneFavorite”分享到微信收藏 * WXSceneSession: 分享到聊天界面 * WXSceneTimeline: 分享到朋友圈 * WXSceneFavorite: 分享到微信收藏 */ type IScene = 'WXSceneSession…
方法 /** * 获取导航栏信息 */ getSysBar() { return new Promise((resolve, reject) => { uni.getSystemInfo({ success: (e: any) => { console.log(e, 'systemInfo') // this.compareVersion(e.SDKVersion, '2.5.0') let statusBar = 0 let customBar = 0 // #…
依赖 pnpm add html2canvas # html转换canvas pnpm add vue-qr # 二维码生成 pnpm add file-saver # 图片下载 实现 <template> <div id="vue-qr-con" ref="vueQrRef"> <vue-qr :logoSrc="logo" :size="size" :text="value" /&g…
实现方法: // Vue3.0 响应式原理 // 1). 2.0默认会递归(数据尽量扁平化) 2). 2.0数组改变length是无效的 3). 2.0对象不存在的属性不能被拦截 // proxy 兼容性差 ie11不兼容 let toProxy = new WeakMap(); // 弱引用映射表 es6 放置的是 原对象:代理过的对象 let toRaw = new WeakMap(); // 被代理过得对象:原对象 // 判断是不是对象 function isObject(val) { return type…