vue3+vite3实现路由自动化
import {createRouter, createWebHashHistory} from 'vue-router' const modules = import.meta.glob('/src/pages/**/index.js'); console.log(modules); const routes = []; let components = []; Object.keys(modules).forEach(key => { let component = modules[key]; components.push(component()); let name = key.split('pages/')[1].split('/')[0].toLowerCase(); let path = "/" + name; if (name === 'index') { path = "/"; } ...
h5吹气互动(利用recorderjs获取输入音量大小)
h5吹气互动原理是利用获取麦克风音量，用一段逻辑来判断。研究了半天~ 最开始用的是下面这种方法（在ios下失效）： <!doctype html> <html style="font-size: calc((100vw / 375)*10)"> <head> <meta charset="utf-8" ></meta> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> <title>Disney Spring Web - voice！</title> <script src="./recorder.mp3.min.js">&...
使用html5-qrcode 扫描二维码(vue3)
/* Your code... */ <script> import { Html5Qrcode } from "html5-qrcode"; export default { name: 'HelloWorld', props: { msg: String }, mounted(){ console.log('hello...'); this.getCameras(); }, methods:{ getCameras() { Html5Qrcode.getCameras() .then((devices) => { /** * devices would be an array of objects of type: * { id: "id", label: "label" } */ //alert(JSON.stringify(devices)); if (devices && devices.length) { this.came...
彻底解决不同分辨率下的绝对定位问题/大小问题
原理就是 font-szie + rem <!doctype html> <html style="font-size: calc((100vw/375)*10)"> <head> <meta charset="utf-8"></meta> <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0;"name="viewport"></meta> <title>Disney Spring Web！</title> <style> html,body{ margin:0; padding:0; } .container { max-width:1000px; margin:0 ...
wx.miniProgram.navigateTo不起效果
官方文档地址： https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html <span class="token comment">// javascript</span> wx<span class="token punctuation">.</span>miniProgram<span class="token punctuation">.</span><span class="token function">navigateTo</span><span class="token punctuation">(</span><span class="token punctuation&quo...
WebStorm和 VSCode集成cmder
VS Code配置Cmder 使用 ctrl+, 快捷键打开设置页面，选择右上角的{ }切换到settings.json文件，添加下面的配置即可 { ... "terminal.integrated.shell.windows":"C:\\windows\\System32\\cmd.exe", "terminal.integrated.shellArgs.windows":[ "/k D:\\Tools\\cmder_mini\\vendor\\init.bat" ], ... } WebStorm配置Cmder ctrl+alt+s 打开设置窗口，选择 Tools>Terminal 设置 "cmd.exe" /k "D:\cmder\vendor\init.bat"
js/jquery实现连线拖拽
先看效果图： https://blog.peos.cn/wp-content/uploads/2022/10/2022-10-31-16.03.53.mp4 code: <!DOCTYPE html> <html> <body> <style type="text/css"> body, svg{width: 100vh; height: 100vh;} svg{ position: relative; } </style> <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> <h1>My f...
macOS Charles 4.x版本的安装及使用（含破解激活）
下载安装 Charles官网下载安装包，下载成功后根据指示安装即可 官网地址： www.charlesproxy.com Charles激活码： Registered Name: https://zhile.io License Key: 48891cf209c6d32bf4 （转自CSDN：blog.csdn.net/qq_25821067…） 激活步骤： 打开Charles，help→Registered to，输入账号和key提交破解成功就可以正常使用啦！ 设置PC端代理端口号 设置端口号如：8888（也可更改，手机设置代理输入一致即可） 设置手机端代理端口号 查看IP地址 手机连接与Mac相同的无线网...
微信小程序的反编译
以一个简单的例子介绍下小程序反编译操作流程 实验环境 前置准备 模拟器内软件安装 获取小程序包 开始解包 导入开发者工具 补充注意事项 400+人技术交流群 有偿逆向 uniapp 逆向服务 逆向教程小程序(已被举报停用) 分包教程 小程序逆向视频专栏 小程序逆向训练营 小程序正逆向·进化岛(已停止加入) mp-unpack 1.2.x 焕新上线，推荐使用😄 #实验环境 操作系统:MacOS10.13.6 node:v10.8.0 微信开发者工具:Stable v1.02.1910120 #前置准备 需要安装pc端模拟器工具可以选择网易MuMu,或者...
Flex 如何让最后一项右边对齐？（CSS）
Flex 中使用 justify-content, 规定项目之间的对其方法，如果要让最后一项向右边对齐，如下图： 有一个简单的方法，在最后一项元素使用样式： margin-left: auto; 原文来自stackoverflow