WishMeLz

生活其实很有趣

分类 Vue 下的文章

TOTP otpauth

import * as OTPAuth from "otpauth"; let totp = new OTPAuth.TOTP({ // Provider or service the account is associated with. issuer: "ACME", // Account identifier. label: "AzureDiamond", // Algorithm used for the HMAC fu...

vuedraggable

在线预览<template> <div class="c"> <vuedraggable handle=".handle" class="list-group" tag="ul" v-model="list" v-bind="dragOptions" @start="drag = true" ...

createDecorator 自定义装饰器

二次确认import { MessageBox } from 'element-ui' import { createDecorator } from 'vue-class-component' export function Confirm(msg: any) { return createDecorator(function (opts, handler) { if (!opts.methods) throw new Error( 'This decorator ...

nuxt项目本地启动,多开标签一直显示加载中

本地npm run dev启动,多开几个标签页,会出现卡死或一直转圈的情况,如果关闭其中一个tab标签,卡死的tab标签页就会立即加载完成,控制台看不到任何错误信息。 因为浏览器对同一个主机有连接数限制。官方解释:https://github.com/nuxt/nuxt/issues/8190

修改原型链导致前端预览PDF异常

添加/修改原型链,导致pdf.js解析异常, 可能此库对原型链做了防污染处理报错如下The `Array.prototype` contains unexpected enumerable properties: hasItem, removeItem; thus breaking e.g. `for...in` iteration of `Array`s其中 hasItem , removeItem 为自定义添加的内容解决方法 let unexpectedProperties = [], logArr = []; for (let key...

移动端 pdfh5 预览pdf

import pdfh5 from "pdfh5"; import "pdfh5/css/pdfh5.css";let pdfH5Res = new pdfh5("#signpdf", { pdfurl: resUrl, responseType: "blob", });报错异常The `Array.prototype` contains unexpected enumerable properties: hasItem, removeItem; ...

echarts 点击事件

通用点击事件 myChart.on('click', function (params: any) { if (params.componentType == "xAxis") { } // if (params.componentType == "series") { // } }) 不是数据的地方点击不触发 myChart.getZr().on('click', (params: any) =>...

一个项目不同版本的依赖包

"codemirror": "^6.0.1", "codemirror5582": "npm:codemirror@5.58.2",npm install 别名@npm:包名@版本号 npm install codemirror5582@npm:codemirror@5.58.2

划词弹框

鼠标选中文本弹出悬浮框,计算选中文字的位置。@mouseup.stop="handleMouseUp" <div class="cont" id="textareaCont"> <textarea @select.stop="onSelect" @keydown="onKeyDown" ref="origintext" v-model="origin"></textare...

qrcode

import QRCode from 'qrcode' let canvas:any = document.getElementById('canvas') QRCode.toCanvas( canvas, 'text', { width: 150 }, function (error) { ...

浏览器内核判断

const userAgent = navigator.userAgent; const isWechat = /MicroMessenger/.test(userAgent); const isAlipay = /AlipayClient/.test(userAgent); const isChrome = /Chrome/.test(userAgent) && /Google Inc/.test(navigator.vendor); const isFirefox = /Firefox/.test(userAgent); con...

Vue2+Tsx 的一个问题

const userInfo: any = UserService.getUserInfo() const userId = userInfo?.userId || 0如上,userId 最后没有使用,会报什么问题?

Vue JSX/TSX $attrs用法

<el-table data={this.data} height={this.height} {...{ props: this.$attrs, on: this.$listeners, }} ></el-table>

html 导出 pdf

import html2canvas from "html2canvas" import JSPDF from "jspdf"封装 printPdf.js // 导出页面为PDF格式 import html2canvas from "html2canvas" import JSPDF from "jspdf" export default { // eslint-disable-next-line install (Vue, options) { Vue.prototype.ExportSavePdf = function (...

Nodejs+Express+Vue 分片上传文件

Vue<template> <div class="upload"> <el-upload :before-upload="befUpload" class="upload-demo" drag action="/" :show-file-list="false" > <el-icon class="el-icon--upload"><upload-filled /></el-icon> <div cla...

Axios封装 2.0

import axios from "axios"; import { Notify } from 'vant'; // 这个是异常提醒弹框. vant或者ele的,在或者其他的 import router from '@/router'; // 做跳转 //下面三个是错误处理. 底下的拦截判断出异常. 这里通过 errorCreate new一个Error, 然后在使用 errorLog 打印出来在页面提示一下. 可以直接写成提示的 function errorCreate(msg) { const error = new Er...

Vue移动端轮播图 中间大,两边露一点

npm install vue-awesome-swiper@3 npm install swiper<template> <div v-if="items.length" class="full-page-slide-wrapper"> <swiper :options="swiperOption" ref="mySwiper"> <!-- slides --> <template v-for="(item, i) in items"> ...