- 博客(150)
- 资源 (21)
- 收藏
- 关注
RSS订阅原创 element plus：tree拖动节点交换位置和改变层级
图层list里有各种组件，用element plus的tree来渲染，可以把图片等组件到面板里，面板是容器，非容器组件，比如图片、文本等，就不能让其他组件拖进来。对于其他组件来说，只有before和after是允许的，所以当type不等于inner的时候，allow-drop的返回值才是true，否则是false。比如把A节点向B节点拖动，before表示把A拖到B的前面，after表示把A拖到B的后面，inner表示把A拖到B里面去。关键点：draggable为true，设置allow-drop方法。
2024-04-23 17:54:08
67
原创 JavaScript：阻止默认行为导致所有输入框无法输入内容
每次解决一个问题，又会遇到新的问题，最近都是忙着改大屏设计器，加容器组件，眼看着要完成了，突然遇到一个大问题，表单的输入框突然全部无法输入数字和英文，搜了很多类似情况，大多数说是v-model绑定的变量没有初始化，还有的是因为表单绑定了pinia，一一排查后，都不是我的情况。大屏设计器组件可以用键盘上下左右键来控制移动，我发现按上下键的时候，页面会滚动，所以就加了阻止默认行为，这下页面不滚动了，但是导致了输入框无法输入内容这么严重的问题。希望这篇博客对大家有所帮助，毕竟突然无法输入了，还是挺着急的。
2024-04-23 11:24:15
121
原创 element plus：tree强制更新
使用element plus的tree组件，做大屏设计器的图层列表，在左边的tree里和中间的编辑器里都可以右键上下移动图层，但是我遇到一个问题，往编辑器里增加组件，这种较大的变动，tree的渲染可以立马同步更新，但是如果我仅仅是移动图层，tree就没反应了，其实绑定的数据已经发生了变化，数据里元素的顺序变了，查了一圈，目前可行的办法是用v-if来重新渲染tree。监听updateLayer，只要发生了改变，就先销毁tree，再重建，需要注意的是，重建要放在nextTick里。给tree加v-if。
2024-04-23 05:13:24
84
原创 vue3：自定义组件使用v-model
首先，在自定义组件里，得有一个名为modelValue的属性，当modelValue变化的时候，触发update:modelValue事件，把新值传给父组件。父组件调用子组件，特别注意，这里不需要@update之类的了。组合式API写法，modelValue前面要加props。
2024-04-19 16:54:45
195
1
原创 css：echarts渐变色转换为css渐变色
css里线性渐变从上到下，是to bottom，从左到右，是to right，把颜色数组像['#000','#111','#222']放进去即可，不需要设置百分比位置。offset是百分比位置，color是对应位置的颜色，new graphic前面四个参数表示渐变的方向，我这里默认是从上到下，从左到右，想要反过来的话，直接把颜色反过来就行了。通过一个下拉框来选择渐变类型，为了简化，我设置了三种：水平方向的渐变、垂直方向的渐变和径向渐变用，表格来配置echarts渐变色的百分比位置和颜色。
2024-04-19 16:17:28
250
1
原创 vue3：img使用方法设置动态路径
特别要注意，在get方法里，不要return路径，然后试图把路径直接传给html里的require，这种方式会报错，必须得在html里拼接路径。我的情况特殊在icon的名字需要通过方法获取，不是简单的设置成element.icon就可以的。网上有很多方法，试了一遍，只有下面这种方法是最简单并且合适我的。
2024-04-05 11:51:36
256
1
原创 css：img引入svg后修改颜色
此方法亲测有效，缺点是svg如果原本包含多色，会被处理成单色，比如我这里就都会变色灰色，点击后设置一个颜色，也只能是单色。如果是比较有耐心，可以每个分组设置两个svg图片，一个是默认图片，一个是激活图片，就能保持svg多色性。
2024-04-05 11:44:08
652
原创 vue3：使用draggable拖拽组件
item的slot里必须是写element，我试过写item，会报错，可以带上index，也可以不带。直接复制了之前vue2的代码过来，发现一直报错，一查资料，才知道变化很大。用list属性，不用v-model了。item-key必须要填。一定记得要加@next。
2024-04-04 21:45:36
266
原创 uniapp：使用subNVue原生子窗体在map上层添加自定义组件
1、创建一个nvue页面，也就是需要在map上层显示的组件，这是子组件，原生子窗体只能用nvue开发，必须遵循nvue的语法规则，很多uniapp组件在nvue里使用不了，很多css也使用不了，这是比较考验耐心的，开发前多研究一下nvue和vue的区别。我们想要在地图上层添加自定义组件，比如一个数据提示框，点一下会展开，再点一下收起，在h5段显示正常，但是到app端真机测试发现组件显示不出来，这是因为map是内置原生组件，层级最高，自定义组件被挡住了，无论如何设置自定义组件的z-index都没有用。
2023-10-17 15:40:39
928
原创 ant design vue:自定义锚点样式
要做一个如下图的锚点，ant design vue的锚点样式比较简单，按照官网文档:affix="false" :showInkInFixed="true"，就可以显示小方块，但是我试了一下不管用，而且锚点组件不固定起来很不方便，所以放弃这种方法。css样式上还需要改动，去掉蓝色小条，并且将灰色竖线往右移到图标的中间去，样式如果不生效，就加!important。之后想过用时间轴和步骤条来模拟锚点，样式很容易达到如图效果，但是在锚点定位上要做太多改造，还是放弃了这种方法。
2023-10-17 08:41:39
912
原创 uniapp：动态修改页面标题
我们经常遇到这种情况，点击新增按钮，进入一个空白表单页面，点击修改按钮，其实也是进入这个表单页面，只是表单内容已经被数据库的记录反显了，为了区别页面，我们还需要动态设置页面的标题，让客户知道是在做新增还是在做修改。首先，在跳转前的url里传递参数，这个参数可以自定义，我这里是传递一个对象，需要先将对象参数转为JSON字符串，并使用encodeURIComponent编码。然后在跳转到的页面接收参数，通过判断这个参数值来确定B页面的标题是修改还是新增。
2023-10-04 10:05:41
1791
原创 uniapp:tabBar点击后设置动画效果
自定义tabBar的原理是，页面的上部分分别是tabBar对应的页面组件，下部分是固定在底部的tabBar，通过点击tabBar获取到当前索引，然后通过v-if来判断显示哪个页面组件，跟原生tabBar不同的是，这里仅用一个page，所以在pages.json里只需要注册index页面即可，在router里也只需要设置index即可，同时也要注意，其他页面组件并不是一个页面，所以没有onShow，onLoad等方法，可以通过computed和watch来达到类似效果。
2023-09-25 20:36:21
2271
原创 uniapp：如何修改组件默认样式
日历组件默认样式如下图，但是我不想要右上角的红点，并且日期下面的数字要加红色背景，变成圆形，还是先用元素检查找到元素的类名，然后通过/deep/来覆盖样式，需要注意的是，lang要scss或者less，lang必须要写，否则不生效。但是今日的颜色还是蓝色，我试了一下，用上述方法不管用，这时候就可以试试直接去组件里修改，通过全局搜索可以找到样式的具体在哪个文件里。总结一下：先查找元素，然后用/deep/覆盖样式，如果无法覆盖，就直接去组件里修改样式。进过样式覆盖后，基本效果都达到了预期。
2023-09-25 20:15:47
1222
原创 uniapp：如何修改路由加载条的样式
路由加载条默认是绿色，通过元素选择工具我们可以知道元素的类名是#router-loadding .loadding，具体设置在h5-dom.js文件里。important一定记得要加，否则不生效，如果还不行，就试试加/deep/.加载条变成红色，并且右边的元素查看也显示样式被覆盖了。
2023-09-25 11:39:30
275
原创 uniapp：不同权限设置不同的tabBar
admin和jeecg两个用户tabBar的区别是，后者有订单，前者没有，所以if else我们就把订单这一项的visible根据判断重新设置一下，其他项默认就是true，要显示，需要注意的是，一定要把if else写全，我第一次就只写了if，没写else，导致效果出不来。jeecg用户显示：首页，订单，消息，发现，我的，一共5个tabBar。admin用户显示：首页，消息，发现，我的，一共4个tabBar。我这里一共有5个页面，每个都要加这段代码。jeecg用户有订单，admin没有。
2023-09-20 19:04:25
1309
4
原创 jeecgboot：vue3版本打包失败的解决过程
本着寻根问底的精神，我决定继续探索，两个版本相隔这么近，没道理会差别这么大。对比他发给我的node安装包和我自己下载的node安装包，我才发现，他用的是X64版本而我用的是X86版本，这应该就是问题所在了，我又重新装了16.20.1的X64版本，果然也可以。以前看到多个版本的安装包。但是别人都能打包成功，没道理我就不行，又多加了几个jeecgboot的群，有偿求助，终于有一位大佬出手相助，用向日葵远程帮我解决，他卸载了我原来的16.20.1版本的node，安装了16.15.1的node，问题就解决了！
2023-07-13 21:20:46
830
原创 css：全局设置滚动条样式：鼠标移入才显示
需要注意的是，如果容器想要带滚动条，那么它本身要设置滚动overflow: auto;否则全局设置滚动条也是无效的。全局引入该css文件即可。
2023-07-07 17:34:21
2784
原创 AJ-Report：给中国地图增加底图设置
这段代码的意思是，先获取到下拉列表的值（为了配合json文件的中文名称，我把下拉选项的code和name都设置为中文了），这个值也是省份的名称，通过省份名称读取对应的json文件，利用echarts注册地图，map是地图的名称，mapData是注册地图需要使用的json文件，然后把options的geo设置为刚才注册的地图。1、准备底图json文件，aj report自带了map的json文件，但是我发现少了浙江省，从其他地方复制过来了。3、在地图vue文件里新增设置底图的方法，并且加到编辑器里去。
2023-04-25 13:48:02
673
1
原创 AJ-Report：如何新增图表
label是工具栏的二级目录的名称，仔细观察柱状图配置文件的结构会发现，四种图表的type和tabName都相同，但是label不同，有专门的代码去处理这些配置文件，将他们生成页面需要的格式，我们需要做的就是按照格式填写配置文件即可。新增vue图表文件，这里才是真正显示图表的地方，为了简化，我在这里写死了一个图表，参考其他文件来写成一个可以修改的图表。跟其他图表一样可以拖到画布上，右侧的菜单需要根据图表具体情况进行修改，我这里只是一个示例，就没有具体修改过来。code是每个图表的唯一标识，不能重复。
2023-04-24 10:33:23
522
原创 MYSQL:Unknown collation: ‘utf8mb4_0900_ai_ci‘解决办法
按照博客内容，我把sql文件备份，然后utf8mb4_0900_ai_ci 替换为 utf8_general_ci，但是依旧报错，这是我发现选中数据库的时候，显示了如下图信息。原来这个数据库的字符集是utf8，排序规则是utf8_general_ci，所以我还要把原sql文件里的utf8mb4替换成utf8，进行了两处替换后，sql文件成功导入了。平时对数据库用得很少，所以容易遇到这些问题，细心一点，多查查资料，就能解决了。
2023-04-15 18:03:39
1166
原创 ant design vue：upload打开选择文件弹框前弹出确认框
继续搜索，发现一个解决思路是使用两个按钮叠加，上层的普通按钮点击后弹出确认框，点了确认后再使用ref的click来触发upload组件内部的按钮点击事件，但是这个方案有一些瑕疵，比如我还得使用css将两个按钮叠加起来，还需要想办法阻止下层按钮的点击事件。看antd文档，刚开始我用得beforeUpload来实现，勉强能完成我想要的功能，但是流程上不完美，需要先选择了文件，才能弹出确认框，但是我的确认框其实跟文件没有关系，我想要先弹确认框再打开文件选择弹框。我这个案例里弹了两次确认框。
2023-03-13 18:47:56
3138
2
原创 ant design vue：select多选一行滚动条显示
至此一切都完美，但是随着项目推移，加入了更多组件，发现一个非常奇怪的现象，某个使用了select的自定义组件在其他地方都显示正常，在某个页面显示异常，宽度不够，高度比其他组件高。排查了半天，发现是上面下拉多选样式覆盖导致的，所以需要给组件加id，css里都加上id，就不会再影响其他组件了。下拉多选默认的样式是这样的，会把行高拉大，跟其他组件行高不一致，影响美观。样式问题有时候会很难排查，并且现象很诡异，上次也遇到过。然后下拉多选就变成一行了，带滚动条显示。
2023-03-11 14:08:15
1379
原创 ant design vue：列值相同的行合并
比如一个5行的表格，1、2、3行值相同，4、5行相同，那么上面的数组就是[3,0,0,2,0]，就是说第1行占3行，第2、3行不占行，这样就相当于把3行合并成1行了，以此类推。上面的方法可以生成一个数组，这个数组保存了需要合并的每一行的rowSpan，然后根据index设置每个的rowSpan就可以了。原博客用的是props，但是antd的官网用的是attrs，我试了一下，用props确实没有效果。列值相同的行合并，这种需求很常见，找了很多合并行的例子，才解决了我的问题。
2023-02-24 08:56:33
1961
2
原创 ant design vue：带日期标记的日历
在template里直接用moment，先import然后还需要在data里再定义一下moment。，如果是做项目的话，直接在App.vue文件里设置，整个项目的antd组件就都被汉化了。，我的日历头部右边只需要显示月，不需要年，把年的部分去掉即可。日历默认是英文的，需要汉化，
2023-02-21 10:01:00
1642
原创 Jeecgboot：中国省市区树形数据生成
Jeecgboot的省市区数据来源于china-area-data组件，我们先利用框架自带的area.js生成具有pid和hasChild字段的表格数据。导入的时候每条记录的id是系统随机生成的，但是我们设置的pid是每个地点的code，并不是每条记录的id，这样导致页面只能看到省份，下面的子节点无法显示。Jeecgboot框架自带省市区下拉选项，但是我们的项目需要使用树形勾选，所以需要进行改造。打开csv文件，去掉所有空格，然后使用online表单的导入功能，将数据写入数据库。
2023-02-20 15:41:34
1489
原创 vue:自定义组件如何使用v-model
在vue中，v-model 的值相当于默认传递了一个名为 value 的 prop 和一个名为 input 的事件（例如：我们使用antd vue的auto complete来自定义一个组件。这个自定义组件我要放在jeecgboot框架里，作为一个通用的自定义组件。注意，这个value的prop是需要在自定义组件内声明的。时，我们有时候需要使用 v-model 来双向绑定。只需要传入 dataSource 联想的数据源即可。在index.js文件里引入。
2023-02-09 10:04:29
708
原创 ant design vue：select选项太长显示不全
加:dropdownMatchSelectWidth='false'即可，但是不同浏览器显示有差异，比如谷歌上显示正常，但是火狐上虽然变宽了一点，但依旧有若干选项显示省略号。auto-complete其实跟select类似，我这个案例是用auto-complete做的。
2023-02-06 17:46:59
1774
原创 echarts：去掉markLine
想要去掉markline，要用this.option.series[0].markLine.data[0].yAxis = {}，千万不要写成this.option.series[0].markLine.data[0] = {}，否则会一直报错。需求：当markline的值为0的时候不显示，不为0的时候则显示。初始值都是0，然后根据自己的条件给每个markline赋值。三元运算符里要写===，我开始写成了=，浪费很多时间。我的图里有多条markline，如下定义。
2023-01-28 18:53:44
979
原创 uniapp:在HBuilderX里使用夜神模拟器
4、点击刷新，就可以看到62001端口的设备了，如果提示找不到设备，可能是端口配置错误或者模拟器没有启动。5、点击右上角的齿轮，可以进行系统设置，比如我想要模拟安卓平板电脑，就选择对应的分辨率即可。点击运行，就从HBuilderx跳转到夜神模拟器去了，会弹出很多权限设置，点击允许就可以了。1、选中需要调试的移动项目，点击运行 ->运行到手机或模拟器->ADB路径设置。如果不知道模拟器的端口怎么办，例如多开模拟器，怎么查看模拟器端口号是多少？2、打开夜神模拟器，点击右侧的模拟器助手图标。
2022-11-21 11:19:21
4508
4
原创 uniapp:使用百度API提取身份证信息（微信小程序适用）
但是接踵而来的问题是，获取token和获取图片都很快，但是识别图片内容超级慢，开始以为是我的网络问题，提高了网速后，识别速度稍微提高了一点，但依旧觉得无法接受，最后在室友的建议下，尝试修改自定义相机的quality参数，网上抄来的代码，设置的是high，也就是说图片高清，信息量可能太大，导致识别速度慢，改成low，识别依旧很慢，最后设置为normal，识别速度终于可以接受了。3、使用前面的token和base64，跟百度发起请求，识别图片内容，提取到身份证信息。
2022-10-21 16:17:37
2722
原创 echarts:面积图按照数值标记颜色
网友求助，要做如下echarts图，分析一下，这是一个基础面积图，然后超过30就标红，低于10就标黄，中间10-30的markarea区域是浅灰色，难点在于标黄的区域，它在折线上边，如果在折线下边，那就好办了。实现过程：1、先画一个面积图，然后利用visualMap来分段设置颜色。参考官网的案例但是我们这里是要根据y轴的值来设置，官网案例是根据x轴，我们需要把dimension: 0, seriesIndex: 0,去掉，然后gt、lt这里设置y轴的值。现在我们得到这样...
2022-05-31 12:10:13
2596
原创 threejs:两点坐标绘制贝赛尔曲线遇到的坑
飞机从武汉飞往背景，根据起点和终点，需要绘制飞机航线，网上搜来的通用代码运行后一直找不到copy属性。坑1：ray的at方法参数变更：仔细排查发现，是ray的at方法修改了，现在必须要两个参数了，只需要增加一个临时变量来充当at方法的target 参数，只需要修改一点点就可以了。坑2：并非所有的起点和终点都可以绘制贝塞尔曲线：代码跑通后，我随便设置了如下图的一组起点和终点，结果绘制的是一条直线。v0和v3设置成下图，甚至还报NAN的错！直到我把v0和v3设置.
2022-05-27 09:57:18
1509
2
原创 threejs：流光效果封装
在网上看到的这种流光效果，在某宝买了源码后，决定把这个效果封装成js文件，以后用起来就很方便了。flyCurve.js文件代码如下：import * as THREE from 'three'var uniforms = { u_time: { value: 0.0 } };var clock = new THREE.Clock();export const timer = setInterval(()=>{ const elapsed = clock.getElaps
2022-05-26 09:23:45
4220
7
原创 threejs：如何获得几何体的boundingBox？
如果我们直接打印boundingBox（如下图），得到的结果将会是null，需要先计算，然后再打印。正确的做法：同理，Geometry的很多属性，也都是要先计算后取值。Three.js中文文档
2022-05-25 10:31:46
1265
原创 threejs：vue导入gltf模型报unexpected token ＜ in json at position 0错误
1、在vue文件导入GLTFLoader.js2、初始化loader需要注意的点：文件必须放在public下面，否则会报unexpected token < in json at position 0错误。路径是'/static/gltf/Duck/glTF/Duck.gltf'，前面不用再加public了。不要用function而要用=>，否则this指向会乱。用一个全局变量把导入的模型保存起来，以便其他地方调用。mounted里先导入模型，然.
2022-05-20 15:12:53
5685
14
原创 threejs:vue里dat GUI的简单用法
1、引入datGUIdatGUI并不是threejs自带的，需要自己另外下载。2、定义datGUI的控制器和添加到控制器里的对象3、对以上两个变量进行初始化CtrlObj是一个对象类型，那么要记得，对象类型的数据由key和value组成，如果key比较少，可以写成上图的形式，如果key比较多，建议用.keyname的形式，如下图，0.01就是key的默认值。4、添加控制器对象到控制器引号里的名字必须跟对象的key一致，后面的两个数据是设置最大值和最小值。...
2022-05-20 14:58:40
1580
原创 threejs：near和far设置错误导致阴影无法显示
关于阴影设置的文章：threeJS中，那些会让阴影失效的操作_weixin_34308389的博客-CSDN博客THREEJS阴影效果_溜得飞起的博客-CSDN博客_threejs 阴影明明自己的代码跟老师的一模一样，为什么阴影就是出不来？花了两小时一行一行代码查，最后发现竟然是near和far设置反了导致的，near一定要比far小才可以。一个完整的代码如下：<template> <div> <!-- 本案例演示添加阴影 --> &l
2022-05-19 13:45:41
984
原创 threejs：相机位置太近导致几何体无法显示
今天是学习threejs的第一天，一切都进行得挺顺利的，唯一的问题是，设置物体尺寸的时候，必须是小于等于1的值，才能显示出来，大于1了，就看不到物体了，把代码截图给网友，网友指出，是相机的位置太近了，相机的位置是1，如果尺寸设置超过1，相当于相机放到物体里面去了，所以就看不到物体了，原来如此！想要尺寸设置为5，name相机的位置要超过5才好。...
2022-05-18 19:14:58
797
原创 echarts：把水球图放到地图上
B站看到这张图，很想学习一下，给up发了私信，可是截止到现在还没有回复，我打算自己先动手研究一下，也是一个学习知识的好机会。实现思路：刚开始的思路是，底图是3D地图，然后上面放水球图，但是水球图并不支持geo坐标，然后寻思着是地图上加散点，然后将散点的symbol设置为gif图，但是我没有美工帮我做这种图，只能作罢，而且就算有美工作图，清晰度不见得很好，symbol也不一定支持gif。继续思考，想用label的回调函数，返回html格式，结果发现label不支持返回html，又想着toolt
2022-05-17 20:22:49
626
原创 echarts：3D图旋转后如何恢复初始状态
1、我们需要知道，旋转角度由option.grid3D.viewControl.alpha、beta来控制。2、我们需要一个事件来触发旋转角度恢复，比如点击画布空白处的时候，旋转角度恢复到初始值，这里有一个难点是如何判断到底点的是空白区还是画布区。切记，是this.myChart.getZr().on，这个方法相当于整个页面都能响应点击，可以返回坐标值。this.myChart.on('click',function(args)这种点击只能响应echart区域，可以拿到echart具体的数据。
2022-05-16 15:43:20
1748
xlsx-style插件创建带样式的excel文件
2022-04-14
使用xlsx-style插件创建带样式的excel文件
2022-04-13
JS速查手册.chm
2011-10-14
jsp入门教程
2011-10-14
AutoIt入门与提高.pdf
2011-09-30
Let's AutoIt.pdf
2011-09-30
autoit-v3-setup.exe
2011-09-30
Java数据结构和算法.（第二版）.pdf
2011-09-27
网吧计费系统源码及数据库
2010-06-17
纯Java JDBC驱动的三个jar包
2010-05-15
java swing Mac风格的look and feel包下载
2010-05-11
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人