龘

原创 Vue3打包后chunk-vendors.js文件过大，加载慢，前端配置项

【代码】Vue3打包后chunk-vendors.js文件过大，加载慢，前端配置项。

原创 Node.js安装包下载链接

Node.js下载官网链接

原创 Vue使用el-select下拉框实现可输入可选择，失去焦点时不清空绑定参数

【代码】Vue使用el-select下拉框实现可输入可选择，失去焦点时不清空绑定参数。

原创 Vue实现Ctrl加S键进行保存

【代码】Vue实现Ctrl加S键进行保存。

原创 vue使用Element-ui使用el-tree控件实现模糊搜索

【代码】vue使用Element-ui使用el-tree控件实现模糊搜索。

原创 vue中使用树控件el-tree如何实现添加加虚线展开树节点样式

【代码】vue中使用树控件el-tree如何实现添加加虚线展开树节点样式。

原创 Vue前端字符串（“false“,“true“）转Boolean布尔值

【代码】Vue前端字符串（"false","true"）转Boolean布尔值。

原创 vue前端根据后台返回的数据实现动态面包屑（使用递归）

【代码】vue前端根据后台返回的数据实现动态面包屑（使用递归）

转载 Vue 中Element的table多选表格实现单选，并且多选表格中表头的多选框不显示或隐藏

Vue 中Element的table多选表格实现单选，并且多选表格中表头的多选框不显示或隐藏

转载 vue使用ifram标签解决父子页面传值，触发事件的操作

1、首先需要明确的一点，标题所说的子页面调用父页面的方法或者函数，是需要父子页面配合的。如果子页面不是你自己开发的， 或者父页面不是自己开发的，那就没办法调用了。而且， 因为业务的特殊需要，我们用到了iframe，如果只是Vue两个父子组件的传值或者调用，其实是非常简单的，百度一下，就能出现很多。在明确了以上的点以后，开始这一次的分享。首先先说一下， 没有在Vue框架中， 就是单纯的HTML页面，子页面调用父页面的函数，其实非常的简单。在子页面中，有一个windows.parent的方法。

原创 Vue 在开发中使用Element框架中的tree组件，配置菜单权限在左侧导航菜单显示，点击子节点菜单时无法获取父节点的id，只有其子节点的和上级菜单的id数组

【代码】Vue 在开发中使用Element框架中的tree组件，配置菜单权限在左侧导航菜单显示，点击子节点菜单时无法获取父节点的id，只有其子节点的和上级菜单的id数组。

转载 vue项目PC端如何适配不同分辨率

vue项目PC端如何适配不同分辨率

转载 element ui table中使用拖拽排序组件sortablejs及注意事项

（2）当table是嵌套在el-dialog等组件中，并且父组件中包含其他table时，直接使用 document.querySelector(”.el-table__body-wrapper tbody")时会拿到父组件的tbody元素，所以需要给个标识（类名）来拿我们所需要的tbody。（1）el-table标签上必须带上row-key=" “,否则拖拽不生效；先安装 sortablejs插件,然后在当前页面引入。

转载 vue+element：current-node-key和setCurrentKey设置默认选中并高亮节点，附带全部展开，全部关闭，重新渲染树结构函数render-content

vue+element：current-node-key和setCurrentKey设置默认选中并高亮节点，附带全部展开，全部关闭，重新渲染树结构函数render-content

转载 Js正则校验

【代码】Js正则校验。

转载 Vue 将数组的字段取出组成key:value形式的对象+key:value 形式的对象组成数组

1.将数组的字段取出组成keyvalue形式的对象。2.keyvalue形式的对象组成数组。

转载 Vue-div横向/纵向拖拽自由缩放

代码】Vue-div横向/纵向拖拽自由缩放。

转载 vue页面超出显示滚动条滑动展示

代码】vue页面超出显示滚动条滑动展示。

转载 对象键值对的形式 转换成对象组成数组的形式（键为值的形式）

代码】对象键值对的形式转换成对象组成数组的形式（键为值的形式）

原创 Vue处理后端返回文件流实现下载

Vue处理后端返回文件流实现下载文件到本地，1、在项目src目录utils下编写一个download.js文件。//请求设置responseType。//在main.js文件全局引入。

原创 Vue ElementUi导航组件结合后台管理实现左侧菜单滚动不显示滚动条

1、代码例 <el-aside :width="Iconflag ? '200px' : '0px'"> <el-row style="width: 100%"> <el-col> <div class="Text">后台管理系统</div> //导航外新包一个盒子，除了Text类盒子不滚动外，其余导航滚动，并不显示滚动条 <div class="Nav

原创 Vue中如何用鼠标滑轮进行横向滑动不显示滚动条

1.页面 //父盒子 <div class="navHistory gzparkNavWarp" @mousewheel="handleMouseWheel"> //子盒子 <el-tag class="gzparkNav" v-for="tag in tags" :key="tag.name" closable :type="tag.ty

原创 Vue图片压缩上传

一、图片压缩图片压缩工具类最大高度和最大宽度都为 500，如果超出大小将等比例缩放。注意可能出现压缩后比原图更大的情况，在调用的地方自己判断大小并决定上传压缩前或压缩后的图到服务器。// 将base64转换为blobexport function convertBase64UrlToBlob(urlData) { let arr = urlData.split(',') let mime = arr[0].match(/:(.*?);/)[1] let bstr = atob(arr[1]

原创 URL.createObjectURL和URL.revokeObjectURL的应用

一.URL.createObjectURLURL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL。这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File对象或者是Blob对象。objectURL = URL.createObjectURL(blob || file);参数:File对象或者Blob对象File对象,就是一个文件,比如我用input type="file"标签来上传文件,那么里面的每个文件都是一个File对象.

原创 base64、blob格式相互转换及应用

1.Base64 to Blobfunction dataURLtoBlob(dataurl) { var arr = dataurl.split(','), //分割为数组，分割到第一个逗号 let mime = arr[0].match(/:(.*?);/)[1],//获取分割后的base64前缀中的类型 let bstr = window.atob(arr[1]), let n = bstr.length, let u8arr = new Uint8Arr

原创 js获取时间戳

1、Date.parse()的使用//返回当前时间的事件戳 Date.parse(new Date());//返回值为14898816000002、Date.getTime()的使用var dateNow = new Date();var time = dateNow.getTime();console.log(time);//打印出来的是14898992432093、巧妙写法 +new Date（）var time = + new Date();console.log(time)

原创 fromData使用方法详解

FormData的主要用途有两个：1、将form表单元素的name与value进行组合，实现表单数据的序列化，从而减少表单元素的拼接，提高工作效率。2、异步上传文件1、创建一个空对象：//通过FormData构造函数创建一个空对象var formdata=new FormData();//可以通过append()方法来追加数据formdata.append("name","laotie");//通过get方法对值进行读取console.log(formdata.get("name"));/

原创 Vue如何实现fromData格式转化成数组

fromData转数组进行参数传递//要传递的数据类型：//【第一种】：var arr=[ {a:"1",b:"s",c:"6"}, {a:"1",b:"s",c:"6"}, {a:"1",b:"s",c:"6"}];//【第二种】：var arrs = [ ["v1","v2","v1"], ["v1","v2","v1"], ["v1","v2","v1"]]; //正常直接 formData.append("name", val) 传

转载 Vue结合Element框架实现图片，文件，视频上传

上传文件的属性修改(这几个是常用，特记录下)：1.自定义上传（默认为自动上传）需要设置： :auto-upload=“false”2. name = ‘appFile’：默认的上传的参数名为file，可以用name属性来修改3. :data属性是设置自定义的上传参数，默认的上传参数只有file4. :show-file-list = ‘false’:是否显示已上传文件列表，默认是显示的，不需要的，就可以先隐藏了 5::limit=“1” ：只能上传一个文件或者图片 6: a:accept：acc.

原创 Vue文件上传图片，文档

原生文件上传： <div style="display: inline-block; position: relative"> <input type="file" class="choiceFileInput" @change="upLoadFile($event, 1)" /> <p class="choiceFileBtn"&gt

原创 iview-admin框架重复点击左侧子级菜单时会报错

在router文件夹下的index.js文件中写入以下代码即可解决路由重复报错问题// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题const originalPush = Router.prototype.pushRouter.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => err)}...

原创 iview-admin左侧菜单只有一个子菜单时，父级菜单不显示的问题

//默认地址，根据这个地址找到这个js文件src/components/main/components/side-menu/mixin.js只要修改mixin.js中showChildren()中的判断条件就可以了showChildren (item) { // 1（默认）改为0即可 return item.children && (item.children.length > 1 || (item.meta && ite

原创 计算属性，监听属性应用场景

这两种场景都是来数据 当data中数据发生改变之后来做的一些操作，计算属性一般只是使用数据进行计算。监听属性 （可以监听路由）==》一般用在 当数据发生改变之后来做一些异步操作等，当页面中某个数据发生改变的时候，需要通知给后台服务器，那个这个时候 就是可以在监听属性中去触发。...

原创 Vue自定义指令、组件、过滤器如何创建

在main.js中写//全局自定义指令Vue.directives("自定义指令名",{});参数el:binding:vnode:oldVnode:

原创 Vue中父组件和子组件生命周期是如何执行的？

执行顺序是：父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子 beforeMount->子monuted->父mounted注意：mounted 不会保证所有的子组件也都一起被挂载，如果你希望等到整个视图都渲染完毕，可以在mounted内部使用vm.$nextTick...

原创 flexible.js、数据可视化

数据可视化数据可视化目的：借助于图形化手段，清晰有效地传达与沟通信息。数据可视化可以把数据从冰冷的数据转换成图形，揭示蕴含在数据中的规律和道理。flexible.js源码：(function flexible(window, document) { var docEl = document.documentElement; var dpr = window.devicePixelRatio || 1; // adjust body font size functi

原创 登录鉴权思路

一、 cookie授权登录1、在vue(项目运行在浏览器中）①.首先用户输入账号密码，前端校验完毕账号密码符合规则之后，把这些数据发送给后端。①.1前端拿到用户密码发送给后端的时候有可能需要加密（MD5 base64）(前后端协商)2、后端通过校验之后 自动的生成session的值 并且在发送给前端的响应头中，设置 set-session字段，这个字段就是后端返回的session值3、当浏览器接收到这个响应头的时候 会自动将session中的值存储到cookie中③.1如果非同源或者有跨域，那么

原创 封装API、axios

一、封装API和axios微信小程序Api的封装：利用模块化封装，exprot default 导出一个对象，在对象里面定义方法，返回一个promise对象，在promise中对微信小程序的方法进行二次封装，然后再需要中的组件中import引入二、小程序axios封装新建一个request.js文件，设置baseURL,定义一个request函数对微信的request方法进行promise封装，然后定义API对象，对象中封装请求数据的方法，return出request函数，然后导出Api对象，最后挂载

原创 微信小程序

Vue小程序介绍微信小程序简称小程序英文名 Mini Program ，是一种不需要下载安装即可使用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一搜即可打开应用为什么要有微信小程序？1、微信有海量用户，而且粘性很高，在微信里开发产品更容易触达用户;2、推广app或公众号的成本太高。3、开发适配成本低。4、容易小规模试错，然后快速迭代。5、跨平台。注意：在微信小程序中一定要注意内存泄漏的问题，不然会造成小程序闪退，所以一定要及时清空事件监听和定时器还有闭包文章目录Vue小程序介绍

原创 小程序的rpx单位换算