Vant UI van-search 键盘没有显示「搜索」按钮的解决方案
使用 enterkeyhint="search" <van-search enterkeyhint="search" class="search" v-model="projectName"
:placeholder="$t('searchAll.placeholder')" shape="round" @search="(val) => search()" @cancel="ba...
分类 Vue 下的文章
Lodop、C-Lodop使用笔记
Lodop(标音:劳道谱,俗称:露肚皮)是专业WEB控件,用它既可裁剪输出页面内容，又可用程序代码直接实现复杂打印。控件功能强大,却简单易用,所有调用如同JavaScript扩展语句件功能强大,却简单易用,所有调用如同JavaScript扩展语句clodop打印机插件，其他语法与官网一样，只是简化注册步骤。目前兼容最低版本：6.2.2.6官网：http://www.c-lodop.com/LodopDemo.htmlnpm：https://www.npmjs.com/package/clodopGithub：https://github.com/W...
vue中v-html
<p domPropsInnerHTML={item.content}></p>
<p v-html={item.content}></p>
el-upload beforeUpload 使用async无法拦截
当使用 async await 包裹的情况下，return false 会失效，应使用 return Promise.reject()
ANSI 字体在前端展示 Jenkins日志
最近在做运维平台的开发，前端需要显示Jenkins的日志在前端，其中的ANSI字体就是如下示例。[92m192.168.134.39:服务启动，端口检测，等待第3秒[0m
[92m192.168.134.39:服务启动，端口检测，等待第6秒[0m
[92m192.168.134.39:服务启动，端口检测，等待第9秒[0m
[92m192.168.134.39:服务启动，端口检测，等待第12秒[0m
[92m192.168.134.39:服务启动，端口检测，等待第15秒[0m
[92m192.168.134.39:服务启动，端口...
获取视频某一秒的截图
const handleGetVideoThumb = async function (url, options = {}) {
if (typeof url !== "string") {
console.error("URL must be a string");
return;
}
// 默认参数
const ...
SSE（Server-Sent Events）
服务端const express = require("express");
const cors = require("cors");
const app = express();
const port = 6548;
app.use(cors());
app.get("/sse", (req, res) => {
res.set({
"Content-Type": "text/event-stream",
&quo...
elementui 动态生成的 el-form-item rules校验失效
<el-form-item key='studyTime' label="学习时长" prop="studyTime">添加一个 key='studyTime', key的内容唯一性就行
公式编辑器
自定义公式编辑器在线预览地址<template>
<div class="home">
<div class="calc-main">
<div
class="formulaView"
id="formulaView"
ref="formulaView"
@click.stop="recordPosition()...
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 ...
Element v-loading 当页面太长，loading的图标无法显示在当前的视口中的问题
在使用 Element UI 的 v-loading 指令时，如果页面内容过长，loading 遮罩层会相对于绑定元素进行定位。这就可能导致 loading 图标无法出现在当前视口中心解决方法：以服务的方式调用import { Loading } from 'element-ui';
let loadingInstance = Loading.service({
lock: true,
text: 'Loading...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0...
axios 设置了返回类型为文件流，但是不返回文件流
if (res.data.type === "application/json") {
let result = await res.data.text();
result = JSON.parse(reader);
}if (res.data.type === "application/json") {
const reader = new FileReader();
reader.readAsText(res.data, "utf-8");
r...
nuxt项目本地启动,多开标签一直显示加载中
本地npm run dev启动，多开几个标签页，会出现卡死或一直转圈的情况，如果关闭其中一个tab标签，卡死的tab标签页就会立即加载完成，控制台看不到任何错误信息。 因为浏览器对同一个主机有连接数限制。官方解释：https://github.com/nuxt/nuxt/issues/8190
Vue TransitionGroup 使用记要
列表的for循环渲染，key值不能为index，否则动画只会作用在最后一个元素
修改原型链导致前端预览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