- 博客(112)
- 收藏
- 关注
RSS订阅原创 pnpm install报错 Value of “this“ must be of type URLSearchParams
执行pnpm install的时候就报错Value of “this” must be of type URLSearchParams。由于之前执行没有出现过这个问题，最近在使用vue3所以使用了高版本的node，怀疑是node版本的问题。修改为14.21.3后问题解决了。当前使用的是20.11.0的。
2024-04-24 10:10:54
109
原创 element-ui升级到element-plus兼容性问题处理
解决：element-plus在el-popover组件中新增了hide-after属性设置延迟关闭。将其设置为0或者其他自定义时间即可。elemen-ui中el-popover的offset默认是0，在element-plus中offset默认是12。解决：el-dropdown-item不能独立使用，在el-dropdown标签内使用。对应的源码位置如下，是elemen-plus中的dropdown-item文件报的错。
2024-03-29 14:41:21
413
原创 nextjs请求public中的静态文件报错 cause: AggregateError at internalConnectMultiple (node:net:1114:18)
【代码】nextjs请求public中的静态文件报错 cause: AggregateError at internalConnectMultiple (node:net:1114:18)
2024-03-21 15:46:26
430
原创 自定义npm包从vue2升级到vue3遇到的问题解决
这个问题找了好久，一直不知道什么问题，网上有人说是因为有两个不同的vue包，但是我开发的是一个组件，实际并没有使用到vue，我的package.json文件是这样的，本身打包没有问题，但是在项目通过npm link 当前组件时就出现上诉问题。查看了我使用的node版本是14.21.3，更新到最新稳定版本20.11.0后重新运行build命令后，不再报错。在我开发的自定义包里面加入配置：（我用的是webpack）
2024-02-06 16:10:18
1075
原创 vue3+webpack构建库打包报错Module parse failed: Unexpected token (2:2)File was processed with these loaders
最后看到重点：vue-loader was used without the corresponding plugin. Make sure to include Vueloaderplugin in your…之前VueLoaderPlugin的这个文件就不存在了，我就直接注释了这个plugin（怪我webpack还是不够熟悉）之前使用vue2+webpack开发了一个npm库，现在想升级为vue3版本（纯手工）开始一直在通过上面的部分找问题：以为是缺少了什么loader，查询了半天还是没解决。
2024-01-26 15:41:03
664
原创 npm install运行报错npm ERR! gyp ERR! not ok问题解决
执行根据报错信息，看出时node-sass运行出现问题。
2024-01-23 15:57:49
2199
原创 vue中keep-alive的理解和使用
它支持对普通组件和路由组件的缓存。获取组件）的name判断是否为需要缓存组件，如果是，先判断之前是否已经缓存，如果没有缓存，将需要缓存的组件保存在一个cache对象中，包含name、tag、componentInstance(组件实例)，然后正常返回该组件，如果在cache对象中已经存在此组件，则将缓存的组件实例直接赋值给当前组件。：哪些组件不要被缓存，同样通过与组件名称匹配，其优先级大于includes，如果未设置此参数而设置了includes，则不在includes中就不缓存。
2024-01-22 15:28:02
556
原创 设置flex布局的元素，其子元素宽度和超过其本身时，其宽度值未被撑起问题
可以单独在外面包裹一个元素scroll-parent，设置其为flex布局，然后设置main-content 样式flex:1。现在想获取父元素的宽度，发现无论子元素的个数为多少，父元素的宽度都是一样的大小，并没有被子元素撑开。如图父元素main-content设置了display:flex.此时main-content宽度就被撑开了。
2024-01-09 15:00:15
656
原创 antv x6填坑指南： 部分节点拖拽和操作撤销重做不生效问题、使用Stencil过滤时过滤后分组的显示高度无法根据过滤节点自适应问题
由于固定分组是画图初始化完就添加的，而动态分组时后面通过接口返回添加的，为了避免新增的分组无法监听鼠标按下事件，固分别执行了stencil.startListening()方法。在过滤方法中为满足过滤条件的节点添加一个属性设置其为true，最后获取分组中包含该属性的节点，即过滤展示的节点，根据节点个数动态设置分组的高度。分组包含固定分组、后台接口获取的动态分组和组件。**问题：**固定分组中的节点拖拽入画布后画布的撤销重做操作无法使用，如果不拖拽加入固定分组中的节点，撤销重做操作正常。
2023-12-04 15:22:09
1114
1
原创 el-popover触发元素位置改变后更新弹出框的偏移位置
但是如果触发元素位置发生变化时，如根据弹框选择内容，会显示或隐藏对应的元素，从而导致弹出框触发元素的位置的变化，此时触发元素位置变化了，但是弹出框还在变化之前的位置。2.监听导致触发元素位置变化的事件，调用组件updatePopper方法。el-popover的使用如下：包含一个触发元素和一个弹出框元素。1.给el-popover设置ref属性。
2023-11-03 17:31:45
1242
原创 使用antv x6注册vue组件报错，TypeError: Object(...) is not a function (teleport.js:3:23)
即模块会使用全局引入的vue，问题就出在全局引入的vue是2.6.14版本，但是模块中使用的是2.7.10的版本。vu-demi安装时是和模块的vue版本对应的，固出现了vue-demi版本和项目实际使用版本不一致的情况。由于项目在index.html中通过本地引入的方式引入了vue.min.js（2.6.14），然后在模块下使用了配置。解决：将全局版本和模块package.json中定义的版本保持一致。点击定位到报错的位置为。
2023-10-26 14:16:59
503
原创 antv x6 沿边图标循环动画实现
2.使用transition给边设置动画,利用complte方法实现循环动画。实现效果，如下图，边上存在两个图标，要求图标延边一直循环动画。1.注册一个自定义边，边上定义两个图标，并设置其初始位置。
2023-10-25 14:55:09
1114
7
原创 Syntax Error: Thread Loader (Worker 4)the “from“ argument must be of type string. Received undefined
【代码】Syntax Error: Thread Loader (Worker 4)the “from“ argument must be of type string. Received undefined。
2023-10-10 11:01:00
912
原创 tippyjs使用中遇到的问题（设置interactive:true报错、主题不生效问题）
使用Cytoscape.js的时候用到了tippyjs插件。
2023-05-17 18:43:37
324
原创 for in、for of、forEach、Object.keys(obj)、Object.getOwnPropertyNames(obj)的区别、优缺点和使用场景
for in可以用于对象、数组、字符串的遍历不能用于Map、Set。for of可以用于具备Iterator接口的数据结构的遍历，不能用于原生对象。
2023-02-14 11:06:45
405
原创 前端（vue)锁屏功能实现，解决刷新会退出锁屏、重新进入显示锁屏页面等问题（新增解决loacalStorage在同一域名下共享问题）
设计一个锁屏页面供用户离开（手动点击）或者长时间未操作时使用
2023-02-06 14:46:33
2732
23
原创 element-ui 表格el-table高度不是一个固定值时固定表头
当height不是一个固定值时，如期望表格可以填充完页面剩余空间，并且固定表头时，可以通过给height属性赋值字符串形式实现。**1.使用一个单独的标签包裹el-table组件，父级组件使用flex纵向布局,父级的高度需要确定（通过固定px或者百分比或者其父级也是纵向flex布局，其设置flex:1来确定高度）/* 可以根据需要设置,也可以是百分比或者在父级flex布局中通过flex:1来确定高度 */height可以为数字或者字符串，当为一个数字时表示固定的高度，也可以为百分比等字符串。
2023-01-05 18:41:30
5446
原创 如何开发自己的npm依赖包，开发-本地调试-打包发布到自己的镜像库
如果希望打包的文件具有命名空间如@vue，只需修改pacakge.json的name，在前面加上命名空间，再执行步骤2的打包命令。
2022-08-24 15:01:31
3842
原创 使用el-dropdown 下拉菜单时移入或点击元素都不显示对应下拉内容，并报错 this.triggerElm.setAttribute is not a function
不具名插槽元素作为触发元素，当前报错为触发元素调用方法调用报错，考虑是否是触发元素获取错误。检查移入的组件和下拉显示的组件先后顺序，移入的组件必须在下拉显示的组件前面。查看el-dropdown组件源码，如果没有单独设置移入元素，则使用。...
2022-08-15 18:26:31
6085
2
原创 element-ui导航菜单el-submen鼠标移入报错Uncaught RangeError: Maximum call stack size exceeded.
el都指向了其自身，所以造成了事件触发进入死循环。问题使用mode为vertical的el-menu组件时，鼠标移入第一级的submenu菜单时，报错Maximumcallstacksizeexceeded.即内存溢出。由于菜单的级数不固定，使用了自定义组件嵌套使用其自身的方式实现递归渲染。这样的问题是，每次进入3707行的判断时其this.都直接写在el-menu标签内，其他子级菜单可使用自定义组件。报错的地方对应本地的代码是element-ui的js文件。...
2022-08-01 17:51:12
1646
3
原创 vueRouter动态添加根路由和子路由
需求：项目为分模块开发，监听到路由地址变化后会动态加载对应的模块，从而动态为框架添加相应的路由。但是有些路由是框架内的页面，有些路由是根路由，比如登录页面是根路由页面，占据整个页面，而业务页面是框架内的页面，框架包含header、aside、main等，路由页面在main显示。实现：router.addRoute()方法动态添加根路由：动态添加子路由：其中parentName为父级路由定义的name字段。举例：...
2022-07-11 10:00:17
5630
2
原创 element-ui组件Skeleton 骨架屏不显示问题解决
问题：项目中使用的是全局注册的方式注册element组件，通过import导入后通过Vue.use注册但是使用的时候该组件并没有显示解决：需要同时再引入ElSkeletonItem---------------------------分割线----------------------------------------由于篇幅不能太短，所以再讲下解决过程，可以直接跳过查看元素如下：发现内部的标签是el-skeleton-item,感觉是没有解析出来。在导入Skeleton的地方ctrl+左
2022-05-26 16:31:18
3564
5
原创 vue router切换子路由，父路由对应组件也被刷新问题
下面是网站的大概框架图：包含主框架、子模块、子模块下的子路由组件，其中/a匹配子模块1，/a/b和/a/b都是子模块1的子路由，显示在子模块的中间容器中问题：当路由从/a/b到/a/c时，子模块1 整个页面都被刷新，包括侧边菜单和中间子路由组件。期望：从/a/b到/a/c时只更新中间内容组件,侧边菜单组件保持当前状态导致问题的原因：在App.vue的router-view标签中设置了key值为$route.fullPath，那么路由地址一旦改变就会刷新整个路由组件，路由组件不会复用。解决：删除A
2022-05-24 14:52:02
5166
原创 vue刷新页面后在mounted中无法获取this.$route.path的真实值
想要在页面刷新后根据当前路由路径判断当先活跃的菜单，故期望通过this.$route.path来获取当前路径，但在created和mounted中this.$route.path值都为/。解决：在mounted中使用setTimeout在定时器中获取pathmounted () { // 不使用setTimeout无法在created和mounted中获取到this.$route的实际值 setTimeout(() => { const curPath = this.$
2022-04-13 16:38:11
3355
原创 vscode配置eslint,实现文件保存使用eslint格式化，问题1.扩展名‘eslint‘被配置为格式化程序，但它无法格式化’JavaScript‘文件。2.eslint命令无法执行
当项目中使用了eslint时，如果保存时不使用eslint格式化，运行时可能会由于个人编码习惯出现很多问题，所以期望在保存时能够自动根据eslint配置格式化文档。eslint 配置完成后始终不生效问题首先说一下eslint配置完后，始终不生效的问题，我之前使用的多模块项目，每个模块独立，但是始终有一个模块的eslint不生效，把模块内容复制到其他模块或新建模块都ok。最终解决：重启eslint。具体操作如下：1.在vscode中使用快捷键ctrl+shift+p打开命令输入框2.输入eslint
2022-04-11 22:49:27
17155
原创 uniapp使用render报错函数[Vue warn]: Error in beforeCreate hook: “TypeError: Cannot read property ‘_i‘ of
需求期望通过数组对象，动态渲染出页面组件方法使用render方法通过$createElement根据对象的type字段确定创建组件并将其他参数传入组件renderParent($h,parent) { const values = this.values const field = parent.options.field let value ; if(field){ value = values[field] } return $h(parent.type,{ props:{
2022-04-07 10:58:13
3670
原创 uview Calendar 日历设置maxDate不生效？uview Calendar 日历展示范围的设置
使用的是uview2.x 版本，官方文档提供了minDate和maxDate两个字段开始以为这是控制显示范围的字段，设置了minDate确实能改变显示的起始值，但是设置maxDate就没效果。查看了源码：展示的月份范围不仅仅是根据maxDate与minDate之前的范围而来，还和monthNum字段有关设置展示月数的方法如下：结果为：最小展示月数为1，在此基础上如果monthNum大于了maxDate和minDate的范围则取maxDate于minDate相差月数，否则取monthNum。
2022-04-01 16:21:05
5246
4
原创 uniapp在APP端运行报错Error: Not Found：Page[2][-1,1；-1,1,0,0,2-0] at view.umd.min.js:1
uniapp项目在H5中运行正常，但运行到APP端就报如下错误：原因：注册的组件没有找到。之前的写法：在init.js文件中引入所有的公用组件，并通过Vue.component(componentName,component)注册，然后在main.js中引入init.js文件。此方法在H5中可以正常运行，但在APP端，组件注册需要直接在main.js中执行，另外在APP端不能动态注册组件，uniapp中Vue.component()的第一个参数为必须为静态字符串，不能为变量。（H5除外）所以下面
2022-03-31 11:24:47
16411
原创 vue为组件/标签动态绑定多个 attribute属性
需求：在父组件中存在一个对象obj，想把obj中所有属性都作为子组件的attribute添加到子组件中。例父组件：<template> <input></template><script>export default { data(){ return { inputAttr:{ type:'text', placeholder:'请输入', } } }}&
2022-03-29 18:02:50
6438
2
原创 uniapp运行到微信程序报错[ pages/**/index.json 文件内容错误] [“usingComponents“][“**“]未找到
在这里插入图片描述
2022-03-24 10:10:27
21625
原创 uniapp运行到手机报错TypeError: Cannot read property ‘addEventListener‘ of undefined
注意！！！！手机端不支持window对象之前项目在app端运行的好好的，突然就不行了，报错TypeError: Cannot read property ‘addEventListener’ of undefined但是我并没有使用addEventListener啊？？后来在全局搜索，发现我使用的一个npm包中使用了window.addEventListener方法，然后又在页面中引入了该包，所以就一直报错。解决：如果要在APP端使用的npm包不能包含操作window对象,所以在app端使用np
2022-03-15 16:23:46
5126
原创 uniapp设置的组件样式在H5和APP中生效，在微信小程序中不生效问题解决
问题：想修改uview组件库中组件的样式，想通过深度选择器>>>(/deep/)的方式修改，修改后在H5和APP上都正常生效，但在小程序中看不到设置的样式。解决：1.需要先在使用自定义组件的组件/页面中添加与data同级的options属性，设置options:{styleIsolation: ‘shared’}2.去掉style标签的scoped属性3.如果还是不生效，查看是否是优先级不够高，通过添加父选择器增高优先级，或者在样式后面加上!important(不推荐，容易影响其他
2022-02-28 11:20:34
12234
3
原创 uni-app禁止在popup组件中的内容滑动/滚动时触发遮罩层下面的页面滚动
解决：在popup组件的父组件中添加@touchmove.prevent注意不是在popup组件中添加，而是在其父组件中添加
2022-02-24 18:00:14
3636
原创 uniapp + 微信小程序，使用v-if控制的slot标签无法显示
uniapp项目在微信小程序中使用v-if控制的slot标签不会显示，如下图：无论v-if中的条件是否成立都不会显示slot组件目前暂时没有找到真正的解决方法，选择了一个适用于当前场景的方法：把v-if的判断放在了slot内部的标签中...
2022-02-24 16:50:44
2679
2
原创 uni-app编写微信小程序将v-for循环出来的参数传入@change等事件时，报错Property or method “*“ is not defined on the instance
需求：通过v-for循环列表，在列表中包含switch组件，想将switch组件的@change事件绑定为item.onChange 在APP和H5中一直报错Property or method “child” is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based
2022-02-24 15:45:19
2005
原创 uniapp真机运行APP，网络请求报错errMsg“: “request:fail abort statusCode:-1 不支持的URL(-1002)
原因为了解决浏览器的跨域问题，在vue.config.js中设置了proxy代理，在H5中请求可以正常发送和接收，但在真机APP上请求报错errMsg": "request:fail abort statusCode:-1 不支持的URL(-1002)。解决:去掉vue.config.js中的代理设置，如果是在manifest中设置的也同样取消掉。在请求地址前加上baseUrl代替proxy。如果baseUrl有多个，可以在一个配置文件中单独列出，在请求方法中手动引入并加到url中。下图是在封装
2022-02-18 11:20:08
4266
原创 uni-app运行时没有报错，H5端显示页面为空白，APP端和小程序端显示正常
修改了App.vue后运行在浏览器中页面显示为空白了，但是APP端和小程序都还是正常显示。原因：在App.vue中不能包含template标签，相当于App.vue里面只能写script脚本和公用的style样式。
2022-02-11 11:29:21
6832
5
原创 uni-app路由跳转（redirectTo、navigateTo）不生效
问题：在页面中给按钮添加路由跳转事件，但是点击后并没有跳转，路由地址也没有变化解决：redirectTo、navigateTo方法中的url属性值前面应该加上/,由于是直接从pages里面复制的，开头不带/，所以无法跳转。另外：如果url是/开头的，但点击还是没有反应的话，看一下是不是在pages.json里面的pages属性中添加了该路径。...
2022-02-11 09:42:15
7886
1
原创 vue打包时在图片处报错，Syntax Error: Error: ‘**\node_modules\pngquant-bin\vendor\pngquant.exe‘
打包时显示在一个图片路径处报错Syntax Error: Error: ‘D:\work\tiny-sample\src\frontend\web\packages\src-entry\node_modules\pngquant-bin\vendor\pngquant.exe’可以看出是因为包pngquant-bin报错了，而该包是由image-webpack-loader的依赖得来的，所以根本原因是在image-webpack-loader.解决：删除依赖image-webpack-loader，
2022-01-07 15:34:24
7998
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人