qq_46608252的博客

原创 在vue中使用AntV/G6完成“V”型树状图且上下级明确，学习心得记录

在vue中使用AntV/G6完成“V”型树状图且上下级明确，学习心得记录

原创 【小技巧】联级多选下拉框，传递数据只传选择的最后一级的数组形式

<el-form-item label="组织" class="dept"> <el-cascader v-model="form.departmentId" style="width: 85%;" placeholder="请选择组织" :options="orgOptions" :show-all-levels="false

原创 结合element完成分列分级树形折叠分级表单

原生HTML完成树形折叠分级表单

原创 基于qiankun框架的微前端学习之路

简单一句话：创建两个新项目，项目A和项目B同时npm run dev运行，通过配置路由的方式，能够在项目A中插入项目B的页面或者应用。文章目录前言一、qiankun是什么？二、使用步骤（以vue技术栈为主）1.创建两个项目2.在A项目中npm qiankun3.在B项目中做以下操作1.在 src 目录新增 public-path.js2.在main.js中添加以下内容3.打包配置修改vue.config.js总结前言因为公司业务需求，开始自学微前端提示：以下是本篇文章正文内容，下面案例可供参考

原创 VUE3-createApp的源码原理

creatApp的源码原理

原创 拷贝一个数组对象所需要的键值对 到另外一个数组对象中

this.batchList = val.map(obj => {return Object.assign({}, { ‘departmentId’: obj.departmentId, ‘salaryBatchId’: obj.salaryBatchId, ‘batchName’: obj.batchName })})拷贝一个数组对象所需要的键值对到另外一个数组对象中...

原创 elment表格底部留白问题

elment表格底部留白问题，固定表格height滚动条的底部却在中间底下留白因为elment .style给了height所以只能自己改css首先给table添加class名称：assets-table.assets-table /deep/.el-table__body-wrapper { height: 289px !important; // 自己设定的高度 }就能解决底部留白问题了...

原创 处理data数据中包含对象的形式

testArr.map((obj, index) => { Object.keys(obj).forEach((key) => { if (Object.prototype.toString.call(obj[key]) == '[object Object]') { const childObj = obj[key]; delete obj[key]; Object.keys(childObj).for.

原创 最全最详细的金额千分号过滤器filters,保留两位小数,filters使用方法

最全最详细的金额千分号过滤器filters,保留两位小数,filters使用方法export function toThousandFilter(num) {// 内含有金额符号，千分号，保留两位小数 var numb = '￥' + (+num || '').toString().replace(/^-?\d+/g, m => m.replace(/(?=(?!\b)(\d{3})+$)/g, ',')) if (numb === '￥') { return '' } els

原创 2021-09-26

原创 多选部门数据进行跳转，把选择的部门渲染成部门树

多选部门数据进行跳转，把选择的部门渲染成部门树要实现的功能，根据多选的数据，重点看部门点击跳转批量处理：渲染部门树如图所示原理，根据多选获取部门id的数组形式[‘123’,'345]跳转之后通过递归查找完整部门树的数据，实现的代码如图所示： // 递归树结构,若id传入和树结构中的匹配则push到新的树结构数组中 digui(num, tree) { tree.forEach(item => { /* eslint-disable */

原创 联级选择器的默认数据展示，获取联级选择器值

联级选择器的默认数据展示，获取联级选择器值今天碰到了一个问题，点击数据编辑的时候，关于联级选择器的数据展示，需要做到如图所示：当前数据v-model中的部门数据必须已数组的形式获取，才能展示联级选择器的第三层的数据:而不是直接获取到最后一个部门的id值，这样是获取不到数据的。必须以数组的形式[‘树节点父子id’,‘第二级id’,‘第三级id’]那么问题来了，如何在已知第三级子节点id的情况下，获取当前树分支的数组。具体实现如下所示：// 首页编辑的时候获取部门 getTreeDe

原创 基于Vue开发的电商APP项目——蘑菇街app

基于Vue开发的电商APP项目——蘑菇街项目源码：https://github.com/Limna777/Shopmall.git1、项目描述2、使用的插件或第三方库3、页面主要实现的功能1、首页2、应用分类3、购物车4、个人中心4、基本目录5、项目截图项目源码：https://github.com/Limna777/Shopmall.git接口私聊1、项目描述项目技术栈Vue2.0 + vuex + vue-router + ES6 + webpack + axios项目采用模块化、组件化、

原创 关于vue图片加载

关于vue图片加载监听图片加载：判断所有的图片全部加载完，只需要一次回调给父组件data(){//imgLength:0} imgLoad(){ if(++this.counter === this.imagesLength){ this.$emit('imageLoad') } }//监听data数据中图片长度的变化的变化 watch:{ detailInfo(){ //只要一变化就更新数据，返回给imgLo

原创 vue报错Error in render: “TypeError: Cannot read property ‘length‘ of undefined“

今天在vue开发的过程中，父组件向子组件传递一个数组列表循环的过程中，数据显示出来了，但是浏览器console总是报这个warningError in render: “TypeError: Cannot read property ‘length’ of undefined”——————————————出现原因：一级数组的时候直接渲染没有问题，但是一级包含对象又包含数组的时候，就会出现这个warning提示：在这里插入图片描述————————————————解决方案：添加v-if，确保他有这个

原创 关于vue轮播图有时候不会自动切换的问题

关于vue轮播图有时候不会自动切换的问题根据coderwhy的vue项目，发现轮播图有时候不会自动播放：原因：是异步操作导致的。在没有抽离模板的时候，即组件内容都在Home中完成的时候，是没有任何问题的；但在抽离了模板之后我的轮播图是在轮播，没有图片，一片空白，只有第一张图。从模板抽离处开始找问题。然后看见了：banners的动态绑定，发现所需的数据是经过异步请求传过来的。要知道，异步请求的结果是在回调函数中，所以先渲染的模板可能会出现空数据的情况，即还没有拿到返回的数据，后来拿到了数据，但模板已

转载 关于VUE项目中报Error: Avoided redundant navigation to current location: 的错

关于VUE项目中报Error: Avoided redundant navigation to current location: 的错在VUE中路由遇到Error: Avoided redundant navigation to current location:报错显示是路由重复，虽然对项目无影响，但是看到有红的还是不舒服。于是查了一下发现可以这样解决在你引入VueRouter的时候再加上一句话：在router下的index.js文件中添加：const originalPush = VueR

原创 关于alias在脚手架4cli4里路径无法生效的问题

关于alias在脚手架4cli4里路径无法生效的问题报错：This dependency was not found:

原创 当我在页面中发送axios请求的时候，报Uncaught (in promise) TypeError: Cannot read property ‘cancelToken‘ of undefined

当我在页面中发送axios请求的时候，报Uncaught (in promise) TypeError: Cannot read property ‘cancelToken’ of undefined，请问是什么原因呢？原因：要把config返回出去，拦截之后还得返回，不然内部的请求信息就会拿不到，不拦截就没事，但是拦截还得还回去，所以不返回就会打印err——————————————————————解决办法：return config instance.interceptors.request.us

原创 js简单编程题目

如果数组中存在 item，则返回元素在数组中的位置，否则返回 -1 function indexOf(arr, item) { if (Array.prototype.indexOf){ //判断当前浏览器是否支持 return arr.indexOf(item); } else { for (var i = 0; i < arr.length; i++){ if (arr[i] === item){ r

原创 我的vue知识点笔记总结（自用）

vue模板语法概述差值表达式指令1、什么是指令指令的本质就是自定义属性格式：以v- 开始v-clock属性绑定：v-bind:href="url"绑定地址简写： ：href双向绑定：v-model(原理：v-bind和v-on属性绑定和事件绑定)样式绑定：通过v-bind 绑定对象语法：<div v-bind:class="{ active: is Active}"></div>数组语法：<div v-bind:class="[activeClass

原创 前端突然就学习到的知识点

toFixed(数字)：保留几位小数

原创 一些jquery常用函数（持更）

一些jquery常用函数（持更）获取时间获取时间function formartDate(){ var date = new Date(); var min = date.getMinutes(); var s = date.getSeconds(); var arr = [ date.getFullYear()+"-", ...

原创 我的jQuery学习笔记（持更）

我的jQuery学习笔记js和juery的区别入口函数冲突问题js和juery的区别1.原生JS和jQuery入口函数的加载模式不同原生JS会等到DOM元素加载完毕,并且图片也加载完毕才会执行jQuery会等到DOM元素加载完毕,但不会等到图片也加载完毕就会执行2.原生的JS如果编写了多个入口函数,后面编写的会覆盖前面编写的jQuery中编写多个入口函数,后面的不会覆盖前面的入口函数...