- 博客(53)
- 收藏
- 关注
RSS订阅原创 npm ERR [email protected] postinstall: `node scripts/build.js`
建议安装的版本和package.json中node-sass、sass-load的配置版本对应，并且更改packer.json文件后删除node_modules文件后重新安装。否则会出现node_sass版本不兼容的问题。
2023-07-05 19:12:24
231
转载 vue +echarts+ docxtemplater导出word和多张图表图片
前期准备1、按照依赖的插件docxtemplater、pizzip、jszip-utils、jszip、FileSaver、docxtemplater-image-module-free。//-- 安装 docxtemplaternpm install docxtemplater pizzip --save//-- 安装 jszip-utilsnpm install jszip-utils --save //-- 安装 jszipnpm install jszip --save//-- 安
2022-05-31 13:30:47
1219
2
原创 html2canvas 实现页面内容生成图片并生成base64码
<template> <div> <el-button class="restore-btn" @click="saveImage('html2canvas', '图片名称')">下载图片</el-button> <div id="html2canvas" ref="html2canvas"> 截取内容<br /> 截取内容<br /> 截取内容<br />
2022-05-31 13:24:01
2385
2
原创 html2canvas实现页面内容生成图片并下载
<template> <div> <button class="restore-btn" @click="saveImage('html2canvas', '图片名称')">下载图片</button> <div id="html2canvas" ref="html2canvas"> 截取内容 </div> </div></template><script&g
2022-05-31 13:08:47
504
转载 vue中 前端根据word模板导出页面中的表格和内容为word文档
<template> <div> <div @click="onloadWordFile" style="margin:50px">点击测试</div> </div></template><script>import Docxtemplater from "docxtemplater";import PizZip from "pizzip";import PizZipUtils from "piz
2022-05-26 17:24:38
648
转载 vue 实现生成二维码
1、安装qrcodejs2npm install qrcodejs2 --save2、组件中引用import QRCode from 'qrcodejs2'3、使用<div class="qrCode" ref="qrCodeDiv"></div>methods(){ bindQRCode () { this.$refs.qrCodeDiv.innerHTML = ""; //获取浏览器地址 const ipPort = do
2022-05-24 13:53:39
175
转载 h5引用词云的方法
<!DOCTYPE html><html lang="en"><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"> <script src='
2022-05-19 15:12:53
217
转载 微信公众号项目禁止在外置浏览器打开
JS代码中加入以下代码let ua = navigator.userAgent.toLowerCase(); let isWeixin = ua.indexOf('micromessenger') != -1; if (!isWeixin) { window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=888" }如果是Vue项目则写在index.html中
2022-05-05 14:28:52
622
转载 vue所有的鼠标事件
vue所有的鼠标事件：单击@click=‘click’按下@mousedown=‘down’抬起@mouseup=‘up’双击@dblclick=‘dblclick’移动@mousemove=‘move’移除@mouseout=‘out’离开@mouseleave=‘out’进入@mouseenter=‘enter’在@mouseover=‘enter’6.移除mouseout和7.离开mouseleave的区别：不论鼠标指针离开被选元素还是任何子元素，都会触发mou
2022-04-24 14:44:17
2346
原创 vue划词弹出框加弹层位置定位
html<div class="select-word" @click="SelectText($event)"> 我是内容区域我是内容区域我是内容区域我是内容区域 </div>弹层<div v-show="selectWordVisible" class="select-word" :style="{top:selectY,left:selectX}"> <ul> <li><span class="iconfont
2022-04-12 12:03:21
1415
转载 vue 点击获取鼠标坐标
HTML<button @click="getMouseXY($event)">点击获取鼠标坐标</button> JS getMouseXY(e){ this.x = e.x //获取鼠标的X坐标（鼠标与屏幕左侧的距离，单位为px） this.y = e.y //获取鼠标的Y坐标（鼠标与屏幕顶部的距离，单位为px） },...
2022-04-12 11:54:02
6145
原创 vue 动态路由传参
路由{ path: '/newSentiment/details/:id', name: 'details', component: details }跳转// 直接调用$router.push 实现携带参数的跳转 this.$router.push({path: `/newSentiment/details/${id}`})详情//获取参数方法id：this.$route.params.id...
2022-04-01 13:29:41
1286
原创 vue 点击选中取消切换
html <el-button @click="searchStatisticsInfo(item)" :class="item.isChoose == true ? 'active' : ''" size="small" v-for="(item,index) in menulist" :key="index">{{item.name}}</el-button> datamenulist: [{ id: 1, isChoose: true,
2022-04-01 10:22:45
1547
原创 html5 文字复制功能（自动换行）
<div @click="copyFun" class="copyBtn" :data-clipboard-text="tableData.cpContent"></div>div的class和实例化class保持一致 // 复制 copyFun () { var clipboard = new ClipboardJS('.copyBtn'); //先实例化 clipboard.on('success', function
2022-03-29 15:28:18
775
转载 微信 HTML5 实现列表页与详情页无刷新返回 seesionStorage
解决思路：使用sessionStorage在列表页中将请求服务端接口返回的列表信息使用一个对象dataList存储起来，并记录当前的页码pageIndex，当点击跳转某个商品详情页之前，将dataList与pageIndex存储进sessionStorage中，当第二次返回到列表页后，先去sessionStorage中寻址，看能不能找到缓存的列表信息，如果存在，就直接使用缓存中的dataList填充列表页，同时清除seesionStorage中的listData缓存，如果不存在，就请求服务端接口填充列表
2022-03-29 15:24:54
268
转载 Git拉取历史版本
1、使用gitbash进入git命令行，查看commit记录。git log2、找到你想提取的目标版本，复制对应的SHA值3、新建一个分支git branch 新分支名 SHA值4、切换到新的分支git checkout 新分支名
2022-03-23 18:18:18
1801
原创 vue中引用echarts全国地图
<template> <div> <div ref="mapInfo" style="width:750px; height: 540px" class="echarts"></div> </div></template><script>import mapJson from '@/assets/json/China.json';export default { data () { re
2022-03-23 11:41:38
274
转载 git配置用户名和邮箱
局部配置，针对具体项目，在项目目录下运行命令：git config user.name "worker95"git config user.email "[email protected]"查看项目的局部配置，在项目目录下运行：git config user.namegit config user.email全局配置（只是多了一个--global参数）：git config --global user.name "user95"git config --global user
2022-03-22 18:20:27
10174
原创 完成进度echarts
option = { title: [ { text: "75%", x: "center", y: "center", textStyle: { fontSize: "24", color: "#0096FA", }, }, ], //backgroundColor: "#ccc", polar: { radius: ["42%", "70%"], center: [
2022-03-22 16:53:55
254
原创 echarts 词云
const colorList = [ "#FACC14", "#2FC25B", "#1890FF", "#9AE65C", "#41D9C7",]option = { tooltip: { backgroundColor: "#fff", axisPointer: { type: "none" }, textStyle: { color: "
2022-03-22 16:48:30
437
1
原创 Vue 路由传参加密
首先，创建一个base64.jsconst Base64 = { //加密 encode(str) { return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function toSolidBytes(match, p1) { return String.fromCharCode('0x' + p1); })); },
2022-03-21 15:25:12
2064
1
原创 vsCode格式化html代码
1.下载两个插件Beautify和vetur2.点击插件Beautify，找到settings.json，如下图：3、进行配置以下代码{ // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, //Ctrl+滚轮实现代码的缩放 "editor.mouseWheelZoom": true, // #每次保存的时候自动格式
2022-03-18 11:13:43
7609
转载 Vue 项目处理每次发版后要清理浏览器缓存
一、在index.vue文件添加如下代码（不推荐）<meta http-equiv="pragram" content="no-cache"><meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate"><meta http-equiv="expires" content="0">二、在打包的时候给每个打包文件加上hash 值，一般是在文件后面加上时间戳，通过vue.
2022-03-17 16:30:04
2891
6
转载 Vue.js 中的 v-cloak 指令（解决网络慢页面出现花括号）
可以使用 v-cloak 指令设置样式，这些样式会在 Vue 实例编译结束时，从绑定的 HTML 元素上被移除。当网络较慢，网页还在加载 Vue.js ，而导致 Vue 来不及渲染，这时页面就会显示出 Vue 源代码。我们可以使用 v-cloak 指令来解决这一问题。html：<div id="app" v-cloak> {{context}}</div>css[v-cloak]{ display: none;}...
2022-03-10 20:19:04
206
转载 JS怎么把字符串数组转换成整型数组
比如有一个字符串：const dataStr="1,2,3,4,5";现在需要把它分割为int型数组：let dataIntArr=[1,2,3,4,5]; let dataStr="1,2,3,4,5"; //原始字符串 let dataStrArr=dataStr.split(","); //分割成字符串数组 let dataIntArr=[];//保存转换后的整型字符串 //方法一 dataStrArr.forEach(item
2022-03-10 09:17:07
5100
转载 vue项目如何引用websocket
<template> <div> <button @click="send">发消息</button> </div></template><script>export default { data () { return { path:"ws://192.168.0.200:8005/qrCodePage/ID=1/refreshTime
2022-02-24 11:45:37
751
原创 css滚动条样式
/*滚动条样式*/ &::-webkit-scrollbar { width: 4px; /*height: 4px;*/ } &::-webkit-scrollbar-thumb { border-radius: 10px; // -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); back...
2022-01-29 16:20:34
202
原创 vue js 数组对象去重方法
for(let item of this.infoListChecked){this.keywordForm.excludeAuthorWords.push({firstWord:item.valueName,secondWord:this.excludeAuthorWords}); let obj = {};let reduce = this.keywordForm.excludeAuthorWords.reduce((cur, next) => { obj[next.secondWo.
2022-01-26 18:02:31
2322
转载 JS如何判断一个对象是否为空、是否有某个属性
一、js判断一个对象是否为空方法一：let obj1 = {}let obj2 = {a:1}function empty(obj){ for (let key in obj){ return false; //非空} return true; //为空}console.log(empty(obj1)) //true为空console.log(empty(obj2)) //false非空方法二：let obj1 = {}if(JSON.stringi
2022-01-07 12:37:24
286
原创 vue-router跳转时打开新页面的两种方法
1、标签实现新窗口打开<router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新页面打开home页</router-link>2、编程式导航seeShare(){ let routeUrl = this.$router.resolve({ path: "/share", query: {id:96} }); window.open(routeUrl.href, '_
2021-11-30 08:58:15
499
原创 蚂蚁图表 f2 手机端饼图
html<!-- 信息各平台分布占比 --> <div class="content"> <div class="content-title" @click="leavePage">信息各平台分布占比</div> <canvas id="myChart" style="width:95vw;height:30vh"></canvas> </div&g
2021-11-23 17:50:43
193
原创 蚂蚁图表 f2 手机端走势图
远程文件引用 <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.5/vue.global.js"></script> <script src="https://gw.alipayobjects.com/os/lib/an
2021-11-23 17:43:36
189
1
转载 js循环的几种方式总结
前言只描述了一些最基本的用法，和一些可能遇到的问题。一些细节，或者特殊写法之类的，没有。1.for循环最基本的循环方式，不多说。但是我在其它某篇文章上，听别人说，这种最基本的循环才是速度最快的，效率最高的。(就是这https://www.jb51.net/article/…for(var i = 0;i<5;i++){ console.log(i)}2.for in循环for in循环是用来遍历对象的。要知道JavaScript对象的所有属性都是字符串，不过属性对应的值可以是任意数据
2021-11-20 12:47:33
15492
原创 vue 实现当前时间到结束时间倒计时
首先封装一个方法，创建文件夹utils，在utils创建pluginUtil.jsvar pluginUtil = {}pluginUtil.install = function (Vue) { // Array.prototype.gRemove = function(val) { // var index = this.indexOf(val); // if (index > -1) { // this.splice(index, 1); // }
2021-11-10 22:31:21
1729
原创 vue 点击添加多个input及多个关键字
html<template><div> <el-button type="primary" size="small" @click="addInput">添 加</el-button> <div v-for="(item,i) of eventPlanForm.matchKeywordArray" :key="i" > <el-input type="text" v-model="keywordList[i]" place
2021-11-10 22:07:37
2542
原创 vue 粘贴复制插件 vue-clipboard2
安装组件，输入以下命令npm install --save vue-clipboard2main.js 引入以下代码import VueClipboard from 'vue-clipboard2'Vue.use(VueClipboard)html<span @click="copyInfo">复制</span>使用方法，在复制方法中写以下内容copyInfo(){ let that = this this.$copyText(this.detailIn
2021-11-10 21:54:13
921
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人