前端
文章平均质量分 54
小太阳!
记录一些自己写项目时遇到难点的解决方法
展开
-
动态循环多表单校验获取不到ref
首先说一下我的使用场景(uniapp):一个页面内五个表单,使用tab来切换展示。这种情况下只能是页面写一个表单,通过循环数据来分别展示的。表单大致填写完成点确定按钮肯定要做正则校验的,通过ref,然后校验那里使用this.$refs.form.validate() 的方式来做校验,但是我后面发现一个问题, 只有第一个表单可以获取到ref的内容,后面循环出来的表单都无法获取到,在后面表单上填写信息时,明明已经填写正确格式的内容,但是校验依然会一直提示,好像填写的内容并没有在当前表单生效。原创 2023-03-06 09:52:36 · 1047 阅读 · 0 评论 -
uniapp小程序底部tabbar图标大小设置
在uniapp中小程序的tabbar没有设置图标大小的属性,导致小程序在不同平台打开时图标大小显示的不一样,特别是在电脑微信打开小程序时,上的效果吧。所以既然代码没法调大小,自定义底部tabbar搞起来又很心累,那我只好从图片剪裁这方面来想办法了。第一张是pc端H5,第二张是微信开发者工具(与手机端效果一样)、第三张电脑微信打开的小程序。图片切图的时候,不要紧贴图像切, 图片四周留出相应比例的空白。代码可以用uniapp的编译器(条件编译)来处理。剪裁后的图片:四周留出空白部分原创 2022-12-28 14:35:29 · 11062 阅读 · 2 评论 -
element树形控件(tree)实现父与子关联,子与父不关联;手动设置半选状态
elemetn树形控件父与子关联,子与父不关联;手动设置半选状态原创 2022-06-10 18:06:29 · 4055 阅读 · 0 评论 -
批量上传视频到阿里云
批量上传视频到阿里云这段时间项目里有一个上传视频到阿里云的功能是我来负责写的,之前一直没有写过这种功能,感觉很难的亚子,但是后来仔细研究了一遍发现也没想象中那么难,最后经过不懈的努力也算是搞出来了哈哈哈,开心坏我了。搞出这个功能真的也是学习到了很多东西,所以就来这里记录一下啦。也有同样需求的兄弟姐妹们希望可以帮到你们一点点嘻嘻,如果有更简单轻便的方法或哪里需要改进的地方也请大家多多指教呦我用的就是 vue+element 写的阿里云给我们提供了客户端上传的SDK使用JavaScript上传SDK原创 2022-01-14 18:45:22 · 3692 阅读 · 0 评论 -
js获取ISO8601规范时间,使用UTC时间,格式为:YYYY-MM-DDThh:mm:ssZ
js获取ISO8601规范时间,使用UTC时间,格式为:YYYY-MM-DDThh:mm:ssZ原创 2021-12-23 09:21:34 · 3590 阅读 · 0 评论 -
element树形控件子节点重复的问题处理
记录一次使用element树形控件踩的坑需求:这次要做的是角色权限配置的需求,需要使用element树形控件来给对应的角色分配对应的导航菜单,像下图这样问题:写的时候主要问题就是只选择一个子组件不选父组件的时候会打印出两条数据,一条完整的父节点包含子节点的数据,一条单纯只有子节点数据。此时需要把勾选的数据信息传给后台data是点击的数据,checked是勾选的数据这样写了以后打印出的数据就会有父组件包含子组件的,也有单个子组件的,总之会很乱就会出现类似这样的bug效果,,还有其他菜单混乱的效原创 2021-05-17 17:42:42 · 2161 阅读 · 2 评论 -
根据屏幕高度判断列表是否滚动
需要实现的效果就是根据屏幕的高度来判断这个列表是否可以滚动这个列表我开始只是用css给他加了一个可以滚动的效果当在全屏时,列表数据有很多已经超出屏幕,这个css添加的滚动效果就出现了,有固定高度的情况下完全可以正常使用但是将整个浏览器高度变小时,再去滚动列表,它已经滚动不了了,所以我们需要把他的高度变成一个动态的值1、在列表上添加一个id2、在data里面定义屏幕高度的变量data() { return { fullHeight: document.documentEl原创 2021-04-03 11:10:40 · 291 阅读 · 1 评论 -
uniapp中uni.getImageInfo渲染页面不生效的坑
uniapp中uni.getImageInfo在渲染页面不生效的坑问题 :写详情页(nvue页面)简介部分的时候发现那个大图片的高度不能自适应,后面的mode各种改变依然达不到想要的效果,又不能设置固定高度,所以只能js部分给它动态设置了解决后来发现文档中有一个获取图片信息的方法:uni.getImageInfo(OBJECT)我想要的正是这个图片的高度 height ,然后就在页面上写了代码:可是把imgheight渲染到页面上时,图片的高度并没有做出任何改变。百度了一下原来u原创 2020-12-25 11:54:02 · 10548 阅读 · 3 评论 -
uniapp中swiper内嵌video组件的坑
uniapp中swiper内嵌video组件的坑功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入是使用uniapp写的项目,需求就是写一个tab切换,tab1里面是一段文本,tab2也是,tab3里面需要使用video组件插入一个原创 2020-09-29 11:19:12 · 7315 阅读 · 11 评论 -
mock入门学习
mockjs入门学习,自动生成数据官网入口:http://mockjs.com/安装:npm i mockjs --save-dev创建mock.js文件mock.js// 引入mockjsimport Mock from 'mockjs'// 图片大小定义let size = [ '300x250', '250x250', '240x400', '336x280', '180x150', '720x300', '468x60', '234x60', '88x31', '原创 2020-07-25 17:21:24 · 1098 阅读 · 1 评论