vue获取节点的父节点、兄弟节点、子节点
<span @click="getClickInfo(event)"></span>getClickInfo: function (e) { let clickDom = e.currentTarget; // currentTarget 获取绑定点击事件的节点 let currentDom = e.target; // target 获取当前点击节点 let parent = clickDom.parentElement; // parentElement获取绑定事件节点的父节点 let previous = clickDom.previousElementSibling; // previousElementSibling获取绑定事件节点的前一个节点 let previousInner = previous.innerHTML; // 获取绑定...
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">&...
es+filebeat+elastalert2实现异常邮件提醒
以下安装都使用docker-compose，docker及K8s安装原理一样ES安装：es: container_name: es image: docker.elastic.co/elasticsearch/elasticsearch:7.2.0 ports: - "9200:9200" environment: - node.name=es - http.host=0.0.0.0 - transport.host=127.0.0.1 - "ES_JAVA_OPTS=-Xms512m -Xmx512m" - bootstrap.memory_lock=true - discovery.type=single-node - xpack.security.enabled=true - xpack.security.http.ssl.enab...
使用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...
springboot使用lock4j实现并发控制
一般情况下，我们使用乐观锁来处理并发超发的情况，但是，乐观锁在某些情况下，并不能彻底解决超发情况，于是只能上悲观锁（synchroized, 独占线程），特别是在分布式的情况下分布试锁就更为常见了。下以使用一种基于redis的分布试锁来实现并发控制。pom.xml增加：<!--若使用redisson作为分布式锁底层，则需要引入--><dependency><groupId>com.baomidou</groupId><artifactId>lock4j-redisson-spring-boot-starter</artifactId><version>2.2.2</version...
springboot全局增加sentinel
pom.xml增加：<!--sentinel--><dependency><groupId>com.alibaba.csp</groupId><artifactId>sentinel-core</artifactId><version>1.8.6</version></dependency><dependency><groupId>com.alibaba.csp</groupId><artifactId>sentinel-annotation-aspectj</artifactId><version>1.8.6</version></dependency><dependency><groupId>com.alibaba.csp</groupId>...
推送镜像到dockerhub
docker build -t brucexhe/sentinel-dashboard:1.8.6 .docker loginusername: brucexhepassword:xxxxxxxxdocker push brucexhe/sentinel-dashboard:1.8.6附 docker run -d --name sentinel-dashboard -p 8718:8718 brucexhe/sentinel-dashboard:1.8.6附docker compose:sentinel:image: brucexhe/sentinel-dashboard:1.8.6container_name: "sentinel-dashboard"ports:- 8718:8718restart: on-failure
彻底解决不同分辨率下的绝对定位问题/大小问题
原理就是 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...