- 博客(50)
- 收藏
- 关注
原创 Vue动态绑定多个类名
我的div是通过循环得来的,循环的项的id要作为类名,并且根据循环的参数的长度,也要设置不同的类名,可以使用如下方法。
2024-12-04 17:05:49
167
1
原创 iframe使用百分比设置宽高不生效
为了适应不同的显示器,宽高不能直接写px,iframe之前我都是使用vw或者vh设置宽高,是可以生效的,但是这次我的左侧是有一个固定宽度的侧边栏,导致不能使用vw,我就想使用百分比,但是一直不生效。我找到一个方法可以很方便的使用百分比,使用子绝父相,就是给iframe的父盒子设置绝对定位,然后iframe加一个相对定位,百分比设置宽高就可以生效了。虽然找到了解决方法,但是为什么iframe使用百分比宽高补班生效的原因我也不知道。
2024-11-20 09:06:35
345
原创 uniApp实现APP内自更新
既然都已经到实现APP内自更新这一步,应该已经创建过应用了吧,如果没有创建的话,应用管理--我的应用--点击右上角的创建应用按钮先创建应用,创建完之后在应用列表,点击蓝色的应用名称,进入完善应用的基本信息。需要先实名认证,然后授权服务中心后新建一个服务中心,可以选择支付宝云、阿里云、腾讯云,可以根据自己的需求选择,如果是测试的话选择阿里云即可,阿里云是有免费的额度,一般测试是够用的。需要登录Dcloud的开发者中心,账号需要和HBuilder X的账号一致,五、应用内自更新的插件。
2024-09-19 15:12:52
1268
原创 el-table自定义表头数据不更新
但是为什么会出现这个情况呢:原来是Vue在编译模板时,会对静态内容进行优化,将其提升为静态渲染,以提高性能。当我们用slot="header"来定义表头时,Vue会将其视为静态内容,不会进行响应式更新。动态插槽会被Vue处理为响应式的内容,当数据变化时,Vue会重新渲染插槽内容,并将其更新到对应的位置上。这样就实现了自动更新。显示是显示出来了,但是数据是最开始默认的,不会更新,后来我搜索到方法,说讲将slot=“header” 改成#header,改了之后的确可以显示了。
2024-05-20 15:57:27
829
原创 VUE中,图片正常显示但是触发了@error
后面终于发现问题所在,我的图片最开始的src是空的,请求回来数据之后才有的正确的src,但是页面最开始加载是在请求之前的,当时已经触发了@error,导致隐藏了图片,后来我在img上加上了 v-if,图片可以正常加载了。但是一个正常的图片链接还是触发了@error,我一开始不知道怎么回事,打印了图片的属性,发现图片的type为error。
2024-05-16 14:06:09
432
原创 el-form-item动态必填
有时候一个字段是否必填需要根据另一个字段的值确定,这时候就需要动态校验,动态校验是绑定在el-form-item上,代码如下。
2024-04-26 15:03:46
1177
1
原创 uniApp设置和清除定时器
在onHide或者是onUnload中销毁定时器,一般来说tabbar页面的切换会触发onHide,其他是onUnload,当然这也不是一定的,不确定的话可以先在这两个生命周期中console.log。首先是在data中定义一个变量,用来存放定时器。在适当的地方创建定时器。
2024-04-22 14:55:04
1542
原创 更改el-cascade默认的value和label的键值
后端返回的树结构中,label的key不是el-cascade默认的label,我需要改成对应的字段,但是一直没有成功,我也在文档中找到了说明,但是我没注意这是在props中改,导致一直不成功。
2024-04-10 10:44:19
1250
原创 微信小程序被删除的文件一编译又回来了
因为我最开始创建错了,快捷创建了页面,右击新建page的时候会自动在app.json里面添加路径,但是我删除的时候没有删除pages里面的路径,而微信开发者工具又有一个默认的功能,就是在app.json的pages下面有相应的页面代码,那么编译的时候就会自动根据对应的页面代码生成wxss、wxml文件。一开始创建错了位置,就想着删除文件重新创建,但是没想到每次重新编译的时候,之前被删除的js、wsml文件就又回来了,后来发现是我在app.json中的pages里面的代码没有被删除。
2024-03-28 10:24:33
2074
原创 npm ERR! code ETIMEDOUT 淘宝镜像过期
清理也清理了,也换了新的镜像,并且查询已经使用了最新的镜像还是不行,后来发现了一个方法,若有需要可以试一试。今天下载依赖的时候一直报错,搜索一番说是淘宝镜像过期的问题,我就试着换了新的镜像,重新下载仍旧疯狂报错。二、需要如上两次输入都为null,否则分别输入如下代码,一定要确保第一步的代码结果都为null。三、这个时候可以再切换最新的淘宝镜像。一、输入这两个代码看一下是否为空。然后就可以了,可以去下载依赖了。
2024-03-05 13:16:14
269
原创 uni-grid-item在小程序和APP中for循环不生效
如上图类型的代码在H5是可以正常生效的 但是在小程序和APP中不生效,我也没有搜索到答案,但是我最后一个格子是固定的,我发现是可以显示出来,所以我就排除了这个标签在APP或者小程序上不兼容的情况,既然单个的是可以展示的,我就试着在这个标签外面包一层标签然后循环好了,结果就显示出来了。
2024-03-04 13:27:33
820
原创 elementUI中table的row-class-name和cell-class-name
但是现在需求改变,觉得一整行都是这个颜色,不太好看,想要符合条件的行的指定列背景色改变,这时候可以使用cell-class-name的属性,写法都是差不多的,只不过cell-class-name的第一个参数的对象里面,是四个属性{row, column, rowIndex, columnIndex},这个时候可以通过rowIndex和columnIndex同时去筛选出符合条件的添加指定样式。因为我使用的是scss,所以深度选择器用的是::v-deep,如果使用的是less,也可以用/deep/
2024-01-25 09:27:13
2286
原创 element-ui表单验证时undefined (reading ‘validate‘)
到这里我终于找到原因了,因为我在created时期就调用了serch方法,但是这个时期无法直接拿到DOM的,所以会报错,可以换成在mounted时期去调用,或者在created时期使用$nextTick去调用。2、el-form-item我是加了prop的,并且和rules中的名称一致。1、el-form中我定义了ref,并且ref前面也是没有加冒号的。2、el-form中也绑定了rules,并且rules前面加了冒号。我搜索了一下,大部分都是说不仔细造成的,但是我一一对照了。
2024-01-15 10:42:09
1124
原创 端口占用Identify and stop the process that‘s listening on port 8083 or configure this application to lis
二、netstat -aon|findstr "8083"查看指定端口被占用情况,获取到对应的pid,如果直接输入netstat -aon获取的是所有的端口号的占用情况。三、可以直接在资源管理器输入taskkill /pid 8083 /f关闭进程,也可以在任务管理器搜索pid关闭进程。有时候项目的异常退出会导致进程未结束,这时候idea再次运行该项目会提示端口号被占用。一、这时候可以先win+R,再输入cmd,进入资源管理器。
2023-12-15 09:39:41
684
原创 el-select初始化触发change事件
后来我发现添加了multiple(开始多选)就会在初始化的时候触发校验,可以理解为如果v-modle绑定的对象的键初始值没有设置,默认是underfind的,但是添加了multiple默认需要绑定的是一个数组,所以会触发change事件。我今天在写一个表单校验的时候,两个下拉框,都用的el-select控件,其中一个校验是正常的,另一个页面初始化的时候就会触发校验。只需要设置当前属性的初始值为空数组即可。
2023-12-13 17:08:40
1841
原创 通过vue-cropper实现图片预览以及滚轮控制图片大小
是不是很简单,实际使用就这几行代码,img绑定一下图片的路径即可,样式看个人喜好。二、第引入,我是直接在单页面引入的,因为我暂时没有其他地方需要用到。本来是准备自己写的,但是可以更便捷的实现这个效果为什么不用呢。一、第一步肯定是下载依赖。
2023-12-12 17:58:27
947
原创 CSS实现鼠标移动到图片上显示遮罩层效果
然后遮罩层用定位的方式,定在图片上,设置好背景色和大小,一开始的时候透明度opacity设置为0,这样就看不到上面的遮罩层。这是一张图片,我希望鼠标移动到上面的时候显示一个遮罩层,层级上有两个按钮,一个查看,一个删除。首先是要写一个大盒子包裹两个部分,一个是图片部分,一个是遮罩层部分,然后再用CSS样式控制。然后当鼠标移动到图片上的时候,将遮罩层的透明度设置不为0,这样遮罩层就显示出来了。
2023-12-12 09:30:23
1686
原创 div换行 (边界换行)
我今天写表格的时候遇到一个问题,明明第一行还没有满就自动换行到下一行,但是我并不希望这样。经过我的一番搜索,我学会了一个新属性。所有主流浏览器都支持 word-break 属性。但 Opera 不支持 word-break 属性。keep-all:只能在半角空格或连字符处换行。normal:使用浏览器默认的换行规则。break-all:允许在单词内换行。
2023-12-08 11:21:54
1050
原创 uniapp内置的checkbox选中不生效
全局搜上面这行代码,然后注释掉z-index: 9;再全局搜上面这行代码,一起注释掉就可以了。
2023-12-05 16:43:15
2874
2
原创 elementui实现表表格el-table分页,默认选中,回显
但是这个方法如果是分页并且需要传所有选中的数据到后端要注意一点,不要直接拿selection-change的数据,因为如果分页有几页的数据没有请求回来,会导致缺少部分数据,可以根据初始的所有选中的数据筛选,或者我们是传变更的数据到后端的,判断数据选中的状态有没有改变。需要设置一个数组,用来存放所有需要默认显示的数据,然后判断表格数据id和需要默认选中的id是否一致,一致的就显示出来,
2023-11-30 15:04:52
2078
原创 Error in callback for immediate watcher “data“: “TypeError: Cannot read properties of null (reading
在el-table标签上加了 :row-key="userId",type="selection"行加了:reserve-selection="true",但是出现了如图报错,原来是table绑定的初始数据不能为null,改为[]即可。我是按照elementUI的教程写的操作的,希望换页的时候之前选中的数据还是选中的状态不要因为换页取。
2023-11-30 11:26:42
1113
原创 ElementUI中el-table组件中的cell-class-name属性如何传参
ElementUI中的el-table组件可以说是一个非常常用的组件,它本身也有非常多的属性和方法,是比较好用的,我们今天是阐述一下我今天遇到的属性cell-class-name。但是我现在的情况是要生成多个表格,每个表格需要高亮的行不一样,所以是需要再额外传递一个参数,这时候该怎么办呢?
2023-11-10 09:16:52
1650
原创 uniapp中sockjs-node/info?t= 报错
我运行的端口和这里配置的不一样,导致跨域问题,这里把port注释掉或者改成想想通的即可。我是个菜菜,刚看到这个的时候是看过一会就发个请求,过一会就发个请求,还以为是哪里用了。,但是我在全部文件中又没有找到相关的,然后搜索一番,说是因为跨域的问题。
2023-10-27 14:30:55
876
原创 uniapp引入vant报错Unclosed bracket
可以在vant的lib里面的index.css中搜索format,然后在format括号的逗号后面,加一个空格。我是想按需引入的,所以创建了一个新的文件vant.config.js,然后在main.js中引入了这个文件。
2023-10-27 10:23:38
935
2
原创 el-cascader设置默认全部
clearable是用来设置是否支持清空选项,checkStrictly用来设置是否严格的遵守父子节点不互相关联。下拉项赋值之后可以再添加一个首项,lable为全部。在data中给绑定的数据添加一个默认值为空字符串即可。然后你就会发现这个级联选择框有一个默认值为全部。
2023-10-09 15:52:02
2321
原创 vue的filter过滤器中如何获取data中的数据
可以先定义一个全局变量 例如that在create中接收一下this的指向然后直接通过that获取到data中的数据即可。
2023-10-09 15:23:11
882
1
原创 CSS选择器以及权重
例如上面这段代码 .box1 box {} 这样写的权重比 .box大,但是权重不会越级,比如我们常常把类选择器的权重比作10,id选择器的权重比做100,但是复选11个类选择器的权重也是小于id选择器的。通配符选择器 < 元素选择器 < 类选择器 < id选择器 < 内联样式 <!权重最低的是继承,然后就是通配符选择器。之后是内联样式,也可以说是行内样式。如果是复合选择器的话,权重会叠加。选择器的权重(由低到高)
2023-09-05 17:14:52
65
原创 Highcharts的X轴为datetime时,时间错乱问题
我获取的时间明明是从0点开始的,但是X轴显示的是从前一天下午16点开始的,后来我查询是highcharts的时区问题,highcharts默认的UTC时区,会比得到的时间早8个小时,这个时候我们设置一下时区就可以了。
2023-08-30 08:50:25
427
1
原创 el-select初始化页面自动触发校验
后来搜到因为初始化的时候绑定的数据不能为null,我就在data中表单绑定的数据里加上了select的数据为空数组,但是我还是想不明白,我的两个下拉框都是在空对象里面,为什么一个被触发一个没有,突然发现被触发的漏写了placeholder,加上之后初始化的时候就不会触发校验了。el-cascader我没有找到满足我要求的,我就想用两个下拉框去实现,先选择组然后通过组el-select绑定的change事件去获取用户的下拉列表数据,我发现初始化的时候用户的下拉框被触发了校验。
2023-08-23 16:32:18
836
原创 Vue中如何解析后端字符串带html
一、首先在 Vue 实例中定义 newsContent 变量,然后将后端返回的字符串赋值给这个变量。二、使用v-html,将后端返回的字符串解析为 HTML。
2023-08-17 11:24:04
1314
1
原创 highcharts.js:12 Uncaught (in promise) Error: Highcharts error #13: www.highcharts.com/errors/13/
Highchartsrts报错
2023-08-03 14:09:11
788
原创 elementUI的DateTimePicker设置了默认时间后无法修改时间
elementUI的DateTimePicker设置了默认时间后无法修改时间
2023-07-24 14:31:54
1316
原创 elementUI的dialog使用:before-close不能在方法名后面加小括号
我今天一个页面有两个Dialog,我想给他们绑定同一个方法,然后传参,根据参数不同进行不同的处理,但我发现我一传参就开始报错。绑定方法时,不能在函数名称后面加上括号来调用函数,否则,函数会在绑定时就被立即调用,而不是在对话框关闭之前触发。我一开始以为是传参后,if判断的问题,但是我后来发现即时不传参用小括号也会报错,然后我搜索发现使用。
2023-07-21 16:49:27
699
1
原创 登录页用的scale方法适应,如何正确销毁
我现在做的是一个PC端的项目,我想的是登录页用scale方法做自适应,然后其他页面就用elementUI自带的row和col,以下是我一开始的错误写法,这个代码我的想法是可以正常实现的,但是我发现在其他页面的时候,会因为获取不到main报错,按理来说我在beforeDestroy时期已经销毁了监听其他页面是不会再继续执行的,一开始我是没有想明白的。后来我请教了一个师兄,直接在setScale中做一个判断,这样控制台的确不会继续报错,但是我发现其实debounce这个方法还是在被执行的,比较浪费性能。
2023-07-13 09:17:02
115
1
空空如也
uniApp的request封装
2024-03-12
TA创建的收藏夹 TA关注的收藏夹
TA关注的人