紫麦熊-优快云博客

方案1：修改label的beforehtml：<div class="custom-checkbox"> <input id="checkbox" type="checkbox" name="checkbox"> <label for="checkbox"></label> <span>自定义勾选</span></div>css: .custom-checkbox

2022-03-10 14:45:34 1016

场景：输入框绑定blur失焦事件，focus后点击按钮，触发了输入框的blur事件，但是按钮点击事件没有触发。原因：blur失焦事件的优先级比click点击事件高。解决方法：1.都触发blur事件里添加延时blurEvent () { setTimeout(() => { // }, 200)}2.不想触发blur，只触发click（1）定义一个flag，click事件设置flag为true（2）blur事件里添加延时，判断flag为

2022-03-02 15:12:40 3411 1

原创 Chrome调试自定义cookie

1.F12打开控制台-Console标签页输入并回车document.cookie='name=value'2. F12打开控制台-Application标签页-Storage-Cookies-点击你要设置cookie的网址手动添加name和value注意：版本98不支持方法二

2022-02-07 18:18:07 1442 1

原创 vue2 elementUI el-table自定义表头插槽数据不响应

背景：使用el-table表头自定义header问题：表头自定义中的数据响应不及时解决：添加slot-scope="scope"<el-table-column prop="name" :show-overflow-tooltip="true" label="名称"> <template slot="header" slot-scope="scope"> <name-select v-model="filterName" @c

2022-01-27 11:18:19 2617 3

原创 Outlook邮件中table td内容不能换行

固定宽度 + word-break: break-all;无效方法一：td添加样式：word-break: break-all;white-space:normal;<td width="300" style="word-break: break-all;white-space:normal">TomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomTomT

2022-01-05 17:05:49 1996 1

原创 outlook邮件插入HTML格式内容调试

参考：https://bbs.huaweicloud.com/blogs/112476遇到发送给用户html格式内容的需求，该如何快速测试呢？Outlook版本： 20161.点击左上方“文件”，出现侧边栏，点击“选项”2.点击“自定义功能区”，勾选“开发工具”，点击确定，使得“开发者工具”选项在最上方出现。3. 点击“开发者工具”选项，点击下方的“宏安全性”，弹框选择“为所有宏提供通知”。4.点击“开发者工具”选项，点击下方的“Visual Basic”,...

2022-01-05 16:46:22 19870 4

原创 js下载文件并修改文件名

1.onload const {url, name} = this.file let x = new XMLHttpRequest() x.open('GET', `/api/download?path=${url}`, true) x.responseType = 'blob' x.onload = function () { let url = window.URL.createObjectURL(x.response) let a =

2021-12-22 16:40:07 3965

原创 elementUI tooltip鼠标滚动后不消失

1.监听鼠标滚轮事件2.隐藏tooltip dom：一定是最后一个添加到dom的tooltip $('.div').bind('mousewheel DOMMouseScroll', function () { const tooltips = document.getElementsByClassName('el-tooltip__popper') if (tooltips.length > 0) { tooltips[tooltips.le

2021-12-09 16:04:30 2157

原创 elementUI table多级表头固定列

设置宽度和fixed// 1、2需要固定，3不固定<el-table ref="table" :data="tableData" border :cell-class-name="tableCellClassName"> <el-table-column label="总" fixed width="200px"> <el-table-column label="1" prop="prop1" width="100px" fixed></

2021-12-02 15:04:45 2566 1

原创 el-input输入tab制表符

问题：tab键默认切换焦点思路：阻止默认事件，获取光标位置，插入\t// template<el-input id="shelf" v-model="inputValue" @keydown.tab.native="tabInput($event)"></el-input>// jstabInput(e) { e.preventDefault() const insertText = '\t' const elInput

2021-12-01 18:04:52 1481

原创 echarts图例自定义

echarts 可配置图例有'circle','rect','roundRect','triangle','diamond','pin','arrow','none'如果想自定义可通过图片来实现this.getBase64(require('./legend1.png'), (url) => { this.legendUrl1 = url })this.getBase64(require('./legend2.png'), (url) => { ...

2021-10-09 16:40:50 1175

原创微信H5 ios点击返回按钮跳转2个页面

这个问题也不是必现的vue项目每个页面限制路由跳转beforeRouteLeave (to, from, next) { if (to.name !== 'next') { // 非前进 if (to.name === 'pre') { // 防止死循环 next() } else { next('pre') } } else { next() } }

2021-09-28 15:06:39 453

原创微信H5 监听窗口变化判断横竖屏

mounted（） { window.addEventListener('resize', this.onWindowResize) this.onWindowResize()}methods: { onWindowResize () { setTimeout(() => { this.clientHeight = document.getElementById('app').clientHeight thi.

2021-09-28 13:55:14 823

原创 css不规则图片进度条

1.准备2张图片：1张白色物体（初始状态）、1张完整形态（加载完成）2.HTML、css<div class="person-container"> <div class="loading_person person"></div> <div class="person-div"> <div class="total_person perso

2021-09-28 13:47:12 382

原创 vue生成二维码带logo

yarn addvue-qr详细配置可访问vue-qr - npmhttps://www.npmjs.com/package/vue-qr<template> <vue-qr :logoSrc="logoSrc" :text="codeUrl" :size="95" :logoScale="0.3" :callback="getCodeUrl" :margin="5" :logoCornerRadius="0" :correctLevel="3">&lt...

2021-09-27 15:55:43 437

原创微信H5调试Vconsole

1.ios安卓通用yarn addvconsole// main.jsimport VConsole from 'vconsole' // ios必须安装才能使用new VConsole()// 有需要的话，根据路由参数决定是否打开if (this.$route.query?.showConsole === '1') { localStorage.setItem('showConsole', '1')} else { localStorage.setItem('sho.

2021-09-27 15:31:47 1166 1

原创微信H5 ios需要2次触发点击事件

yarn addfastclick// main.jsimport FastClick from 'fastclick'FastClick.attach(document.body)

2021-09-27 15:14:55 431

原创微信H5 浏览器打开提示请在微信打开

<!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, .

2021-09-27 14:48:38 2261

原创微信H5 安卓ios禁止用户调整字体大小

方法一：调用微信sdkyarn addweixin-js-sdk// main.js引入import wx from 'weixin-js-sdk'// App.vuemounted () { this.getSignature()},methods: { async getSignature () { try { const res = await this.$http.get('/signature?url='+location.hre.

2021-09-27 14:41:20 644

原创微信H5 ios安卓自动播放视频音频

mounted () { const vm = this if (window.WeixinJSBridge) { vm.mediaPlay() } else { document.addEventListener('WeixinJSBridgeReady', function(){ vm.mediaPlay() }, false) }},methods: { mediaPla.

2021-09-27 14:04:04 1966

原创 vue微信H5自定义分享兼容ios、PC、安卓

1.安装微信sdkyarn add weixin-js-sdk // 安装依赖// 或者在index.html引入<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>// 用依赖包在main.js引入import wx from 'weixin-js-sdk'Vue.prototype.$wx = wx2.配置（1）首先获取签名等信息（appId, nonceStr,.

2021-09-24 17:08:31 1179

原创 hidden ，visibilityChange兼容

// 不同环境兼容 let hidden = '' let visibilityChange = '' if (typeof document.hidden !== 'undefined') { // Opera 12.10 and Firefox 18 and later support hidden = 'hidden' visibilityChange = 'visibilitychange' } else if (ty.

2021-09-22 16:20:56 670

原创添加提示框

html<div class="container" @click="touchScreen"> <div class="tip" @click="showTip"> <div class="tip-div"> <div class="tip-trangle-right"></div> <div class="tip.

2021-09-07 17:44:29 210

原创给div添加blur

<div @click="touchScreen"> <div class="need-blur"></div></div>touchScreen (e) { const className = e.target.className if (['need-blur'].indexOf(className) < 0) { // 触发blur } }...

2021-09-07 17:36:00 324

空空如也

空空如也