- 博客(46)
- 收藏
- 关注
RSS订阅原创 vue2升级后出现编译警告和错误！提示用deep()替代/deep/！vue packages version mismatch
框架进行迁移后出现了标题的警告，但是项目是2版本并没有升级到3，本来只是警告并不影响使用，后来看着碍眼就整它，一系列操作后直接编译错误出现version mismatch错误，再也不能凑活。不能瞎机霸整啊，之前为了解决node溢出问题清除了缓存导致了以上问题，通过上面的办法解决后导致项目里出现了各种bug。把vue-template-compiler版本更改至和vue一样的版本。还原最初的配置后继续尝试安装一下插件解决node溢出问题。
2022-09-19 18:21:51
390
原创 样式问题，页面布局等等
调整宽度就算没有达到100%仍然把右边挤下去了，导致右上角空缺且出现滚动条。百分比布局，没有用flex。解决后的正确布局，完美贴合。
2022-09-14 11:20:59
141
原创 Linux小操作
安装node1、官网下载对应系统的以及项目对应的nodejs；2、看bin目录下是否有node和npm文件，没有的话执行以下： tar -xvf node-v10.24.1-linux-x64.tar.gz mv node-v6.10.0-linux-x64 nodejs3、创建软连接，变为全局(指令：ln -s 文件所在目录 目标目录) ln -s /home/*****/Documents/nodejs/bin/npm /usr/local/bin/ ln -s /home/
2021-11-17 17:45:32
225
原创 Vue3+TypeScrip学习笔记（更新中）
目录VUE3基本变化VUE3基本变化源码1，源码通过monorepo的形式来管理源代码：mono:单个；repo:rebository仓库；主要是将许多项目的代码存储在一个repository中；多个包本身相互独立，可以有自己的功能逻辑、单元测试等，同时又在同一个仓库下方便管理；模块划分更加清晰，可维护性、可拓展性更强；2，源码使用ts进行重写：vue2.x,使用Flow来进行类型检测；vue3.x源码全部使用TS进行重构了性能使用proxy进行数据劫持：vue2.x时候，使用O
2021-05-18 20:59:44
194
原创 保姆级TypeScript 学习笔记
目录前奏简述环境准备代码执行步骤简化执行ts！！变量前奏简述ts是js的超集，给js带来类型系统，还提供了接口，泛型，枚举等高级功能，弥补了js的不足。TypeScript = Type + JavaScript (为js提供了类型系统，试问哪个前端没挨过类型错误的打呢)//TS 有明确的类型let price: number = 81//JS 无明确类型let price = 81环境准备安装node安装解析ts的工具包（nodejs/浏览器不认识ts，需要把ts转换成js）终
2021-04-22 21:33:37
188
原创 html导出PDF，截取带滚动条html结构全部目标内容且保留样式
前人的基础上稍加修改优化了一下，解决了html2Canvas只能截取可见html部分问题以及截取全部目标内容后样式失效问题。具体问题需要具体分析。exportPDF(){//点击事件 //imageDom为pdf目标，注意imageDom的样式需要和body平级，注意不要污染全局 var width = this.$refs.imageDom.style.width var cloneDom = this.$refs.imageDom.cloneNode(true) cloneDom.s
2021-01-13 10:47:05
1125
1
原创 webGL与three.js 学习笔记(先占个坑)
目录官网链接引入three.js组件场景相机渲染器几何体举个栗子长方体/正方体vue中应用点线面定义一个点几何体THREE.Geometry()线材质three.js是对webGL的封装。小白不必看底层代码，底层是一个需要积累量变的过程。参考文献：webGL Three.js教程官网链接官网上有相应的一手资料及课程，各取所需。一、webGL: http://www.hewebgl.com/二、规范（小白不必）：openGL | ES https://www.opengl.org/三、gitH
2020-12-28 17:51:27
417
1
原创 git的小白使用
目录git的工作流程git安装操作创建本地版本库向本地仓库添加文件Add添加至暂存区Commit提交至本地仓库修改提交查看本地仓库修改提交查看历史版本比较版本差异删除/还原本地仓库的文件还原真删除远程仓库简单了解SSHgitHub码云git的工作流程#mermaid-svg-CI7XcpieKSJvVmjn .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;
2020-12-25 16:45:47
183
原创 webpack总结 理解就行，用时再查官方文档
目录概述安装配置配置打包的入口以及出口配置自动打包功能基本使用概述web开发不友好现状：文件依赖关系错综复杂；静态资源请求效率低；模块化支持不友好；浏览器对高级js兼容性问题；…webpack解决以上的前端项目构建工具（打包工具），提供友好的模块化支持，以及代码压缩混淆，处理js兼容，优化性能。理解即可，脚手架中不需要自己搞。安装配置1、安装相关包,vue在建项目的时候就已经全套弄好了npm install webpack webpack-cli -D2、在项目根目录中，创建web
2020-10-28 18:02:40
213
1
原创 async & await 异步请求骚操作
概述ES7新语法，异步操作，超强async用于函数上，其函数返回值是promise实例对象；await用于async函数中，可以得到异步结果；async function queryData(id){ const ret = await axios.get(url);//不在需要回调了then console.log(ret.data); return ret;//直接return出来}queryData().then(ret => { console.log(ret);})
2020-10-28 11:58:26
140
原创 axios总结 异步请求骚操作
概述三方调用方式js库,基于promise，强力max。基本用法axios.get(url).then(ret =>{ console.log(ret.data);//data属性固定写法})常用APIPOST / GET / PUT / DELETE一、GET//url传递参数axios.get('***?id=123').then(ret => { console.log(ret.data);})//restful方式传参,一系列传参方式改变，后台都需要改动a
2020-10-28 11:17:02
400
原创 fetch 异步请求骚操作
目录概述基本用法基本配置响应结果概述基于promise实现，xhr升级版fetch(url).then(fn1) .then(fn2) ...... .catch(fn)基本用法fetch(url).then(data => { return data.text();//fetch API,返回promise实例对象}).then(ret => { console.log(ret);//最终真实数据在这里！！})基本配置1、method(String)
2020-10-28 10:03:11
187
原创 Promise异步编程总结
目录概述AjaxPromisepromise基本用法用promise处理一下Ajax发送多次Ajax请求then参数函数返回值Promise常用API概述Promise => ES6新语法，处理异步编程。多次异步调用其结果出现的顺序无法控制，异步调用确实存在依赖关系就需要嵌套，多层嵌套会产生回调地狱。三种异步编程：一、定时任务 setTimeout & setInterval二、Ajax三、事件函数Ajax一般的请求：$.ajax({ url:'*****',
2020-10-27 21:13:43
147
2
原创 前端 文件流 / blob / file 转换
目录需求以及背景解决：关于blob/file初始文件流file->formData说说file->blob对象需求以及背景这两天有个需求：把上传的/后台返回的图片文件加一个图片转换文字的ocr功能。目前遇到两种情况，一个是从后台接收的文件流，类似以下：一个是用elementui组件获取的file对象类型格式文件。解决：关于blob/fileblob参数要求看这个https://developer.mozilla.org/zh-CN/docs/Web/API/Blobfile
2020-09-30 17:43:35
22086
2
原创 文本域字数限制
直接正文，不要使用onkeyup事件，输入中文的时候会产生bug（拼音的间隔符会占位需要再次触发onkeyup才能正常）。主要使用oninput事件。方法一 ：<textarea id="textid" placeholder="请输入诉求请求" oninput="wordLeg(this);" maxlength="500" ></textarea><div class="word"><span class="text_count">0</sp
2020-09-25 14:51:53
1284
1
原创 vue 刷新icon小动效
点击icon图标，旋转一周。最先尝试的逻辑是，给一个控制参数refresh，初始false，icon绑定两个样式，类似以下：<i :class="[refresh? 'el-icon-refresh go' : 'el-icon-refresh']" @click="iconClick"></i> el-icon-refresh是elementui自带图标.go { transform: rotate(360deg); transition: al
2020-08-24 17:09:59
2843
1
原创 vue 点击复制选中指定文本，超好用
经过测试，方法兼容谷歌和IE，提取成公共方法如下：export function copyText(e) { let text = document.getElementById(e); let selection = window.getSelection(); let range = document.createRange(); range.selectNodeContents(text); selection.removeAllRanges(); selection.addRange(
2020-08-22 17:52:30
2025
原创 数据加载等待 elementUI + vue
数据在加载过程中页面显示空白会让用户感到焦虑烦躁，加一点小动态可以解决这种问题。v-if控制页面三种状态：1、加载中；2、加载无数据；3、展示数据isloading true加载icon显示, false隐藏，初始truehasdata true无数据icon显示，false隐藏，初始false#mermaid-svg-DT1Dzo5kwcKcNgaE .label{font-family:'trebuchet ms', verdana, arial;font-family:var(-
2020-08-22 11:57:22
1439
原创 文字超出三行显示省略号
如下：overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;但是ie浏览器是个孤儿，它不兼容，搜索了很多其他办法觉得甚是麻烦，加上时间紧迫,如下：给你个眼神自己体会。data.length>38?data.substring(0,38)+'...':data...
2020-08-21 18:11:49
2277
原创 计算机可以连接到网络但无法在浏览器冲浪，手动更改DNS
问题“域名系统（服务）协议（DNS）是一种分布式网络目录服务，主要用于域名与 IP 地址的相互转换，以及控制因特网的电子邮件的发送。”电脑有网，微信qq钉钉等软件可以正常使用，但浏览器无法网上冲浪。原因：浏览网页的本质是访问别人的服务器，域名服务器（DNS）出问题了（可能是获取DNS出错，可能是DNS本身出错）。日常DNS是自动获取的，出了问题就需要手动输入。操作步骤一、右键wifi图标，选择 打开"网络和Internet"设置二、选择 更改适配器选项三、双击 你所连接的网络四、选择
2020-07-10 22:32:28
4323
原创 smallCases
目录一、关闭数据执行保护（DEP）一、关闭数据执行保护（DEP）运用三方插件时遇到这个问题解决方法：管理员身份运行cmd输入：bcdedit.exe /set {current} nx AlwaysOff
2020-07-03 15:34:54
109
原创 赋值的坑 0的布尔类型
目录background分析解决background简化一下问题以及代码后台返回中的数据中有这样一组：...rdwtdm:0,//number类型rdwtmc:'新型冠状病毒'，...因为某些原因，原表单提交的rdwtdm是string类型因为数据类型不一致导致表单数据无法回填成功赋值代码是这样写的：rswtdm = rdwtdm?String(rdwtdm):'';打印了一下赋值后的form发现：数据类型复制成功，但数据未赋值成功...rdwtdm:'',//空字符串r
2020-06-24 11:29:28
1174
原创 匪夷所思的一些问题(备忘录)
目录说明一、ElementUI——组件内icon图标说明总结一下日常遇到的UI框架坑，也可能是兼容坑。遇到一些写一些，不停补充。一、ElementUI——组件内icon图标谷歌浏览器一切正常，在IE11浏览器下，像select组件右边那个下拉箭头，还有input内清空按钮的图标line-height属性出现问题，图标要么飞到天上去，要么位置很低。排除全局样式的影响后，line-height值必须和input高度一致，否责值过小过大都无法修改正常。...
2020-06-11 15:08:32
720
原创 强迫症患者福音！筛掉后台返回很多无用的字段！
表单回填的时候，后台传回来很多原表单里没有的无用字段。回填以后在编辑功能下需要把原表单字段再传给后台。虽然这个没用的字段传来传去不影响什么，但要是太多了，谁受得了。以下：//this.form 原表单数据容器//res.data 接口返回数据for(var k in this.form){ if(res.data.hasOwnProperty(k)){ this.form[k] = res.data[k]; }}...
2020-05-26 17:14:29
628
原创 elementUI+VUE 表格数据单行移动
目录需求说明代码步骤需求说明选中表格单行数据，点击上移或下移实现数据移动。操作按钮单独在表格上。代码步骤一、索引获取原有的从后台获取的数据中并没有存放索引，且表格中数据是根据前端的索引编写的序号。添加** :row-class-name=“tableRowClassName” **属性方法<el-table ref="multipleTable" :data="tableData" height="calc(100% - 38px)" tooltip-effect="dark" sty
2020-05-15 12:03:13
1137
原创 请求参数在IE浏览器乱码，请求失败报错
原因1：GET 和 POST混用了。GET请求方式需要参数紧跟其后。两种请求方式其他区别就是你所知道的。高级浏览器一般是不报错的，但是IE浏览器会报错。上香。原因2：IE浏览器转码问题，参照上一篇blog以后遇到其他参数报错报错原因再总结。...
2020-03-31 21:02:09
290
原创 IE浏览器GET请求方式乱码
问题ie浏览器，get方式请求时发生错误，参数乱码，时乱时不乱。以下是我输入“大”字。解决办法encodeURIComponent(JSON.stringify(参数),‘utf-8’)url: "/api/*******/******?data="+encodeURIComponent(JSON.stringify(this.form),'utf-8'),正常了...
2020-02-25 16:00:00
439
原创 根据身份证号来计算年龄与性别 JavaScript && Vue.js
目录计算规则需求环境代码今天我要来写一些笨重的代码（以后肯定会写出简洁的别人都不懂的代码！！！）计算规则据我所了解（可能了解的不是很准确，大家自行网上搜索一下），我国身份证的规则如下：身份证位数出生年份出生月份出生日期性别15位（一代）7、8位9、10位11、12位15位 奇男偶女18位（二代）7、8、9、10位11、12位13、14位17位...
2020-01-03 17:22:48
1253
1
原创 ElementUI select组件下拉选中后同时获取label(name)和value(code)返回给后台
目录使用说明代码使用说明ElementUI中select组件，一般只能获到一个vlue值，通过value值把label展示在页面中。如果仅仅做展示用，这没有太大问题。但是涉及到交互，需要把选中的option的名称和code一起再返回给后台就需要多写几行代码了。话不多说。代码<el-form-item label="饺子" prop="zbldid" label-width="70p...
2019-12-27 18:01:53
8713
1
原创 ElementUI/Vue 联级选择器Cascader 在实际中的应用
目录页面展示代码页面展示代码html部分<el-form ref="form" :model="form" label-width="140px"> <el-form-item label="指定分类(筛选)" prop="nrflCodeId"> <el-cascader :options="nrflOptions" ref="cascaderAdd...
2019-12-18 20:13:30
449
原创 mui弹窗动态添加数据
需求点击添加按钮，弹出弹窗，将信息填入点击确认后，在列表详情中会出现一个只有名字的块，点击出现详情。点击弹出啊弹窗，填入信息。点击确认后添加至详情出现色块点击详情中的色块可以查看、编辑、删除。代码弹窗是自己写的没有用框架的。<div id="popover-dialog" style="height: 250px;"> <form class="mui-...
2019-11-30 16:15:16
1236
1
原创 Vue +ElementUI table中show-overflow-tooltip属性在IE11中的缺陷
这里写自定义目录标题bug出现背景bug阐述解决方案bug出现背景Vue 2.6 +ElementUI 2.12.0 +IE11浏览器bug阐述当鼠标指针指向table组件带有show-overflow-tooltip属性的单元格时，会出现tips提示信息，此时不一定鼠标指针位置，滑动鼠标滚轮，tips信息并不消失，继续滚动会超出table范围继续显示。解决方案当监听到鼠标滚动事件时，...
2019-10-25 11:47:02
1999
原创 var ， let 和 const
var，let和const都是js中定义变量或常量的关键字。var 和 let变量提升和块级作用域二者都是用来声明变量的。var有变量提升，没有块级作用域；let没有变量提升，有块级作用域；var声明的变量可以在声明之前使用，值为undefinedlet声明的变量中，如果对变量先赋值，后声明，会报错，并且所声明的变量，只在let命令所在的代码块内有效。在循环中，使用var来声明变量，...
2019-07-15 18:45:15
109
原创 JavaScript中null与undefined的区别
用汉语直白的解释过来，null是“空”，undefined是“未定义”。这么说起来还是似懂非懂，那么让我们用最简短的语言清楚的解释一下二者的区别。区别区别一：null表示一个对象是“没有值”的值，也就是上面所说的“空”；undefined表示一个变量声明了但没有初始化（赋值），是一个表示“无”的原始值或者说表示“缺省值”，即此处应该有一个值，但是还没定义，尝试读取时会返回undefine...
2019-07-02 14:41:26
387
转载 如何解决Vue.js不兼容IE8的问题？？
如图所示：其他IE浏览器同理。图片源自交流群，如若侵权请联系我删除。别怼我，你怼我我就怼回去。嘤嘤嘤。【呕】
2019-06-30 10:25:26
3748
1
原创 跨域
这是一个基本不会遇到的问题，不过万一呢？？跨域不论ajax，还是promise交互，都遵循同源策略原则。也就是说：http: 协议local: 主机地址/域名9090 端口号三者中有一个不一样就是未遵循同源策略，就不可以使用ajax或this.$http.get/post方式。但是在实际工作中运气实在不好（基本不会）会遇到接口地址和页面地址相左的情况，正常的交互方式就无法请...
2019-06-27 13:08:45
187
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人