- 博客(25)
- 收藏
- 关注
原创 elementUI内el-date-picker样式无法穿透的问题
如上图所示,时分之间有一黑色线条需要去除,穿透未生效,f12得知,该picker是挂载在body上。picker未挂载在#app上面,不能在下面修改。项目需求需要选择 年-月-日 时:分 ,根据el-date-picker属性写出。
2024-08-20 10:15:54 263
原创 element+vue2项目el-dialog弹窗显示的同时操作页面其他内容
项目中遇到一个需求就是在弹窗显示的同时,可以操作页面内的其他元素,比如点击其他元素,显示其他弹窗。在弹窗出现的时候不能点击其他区域,是因为弹窗外面包裹了一层z-index数值比较大的div盒子,想要点击首先需要给el-dialog的遮罩层去掉,并且点击遮罩层不让弹窗消失。将该div的z-index层级数值改的小一点就可以了。
2024-07-29 10:54:04 442
原创 element组件库el-select下拉框样式修改不了的问题
我在一个项目之中需要修el-select的下拉框,但是修改过程之中无论是通过 穿透,还是加!improtant都无法修改其下拉框的样式,查询之后得知不生效的原因可能是select的下拉框渲染过后不在#app上,需要用官方文档上面的popper-append-to-body修改将popper-append-to-body设置为false之后,是可以修改的。
2024-07-26 10:12:26 425
原创 前端打包发布到线上后display:flex失效的问题
今天遇到一个问题就是display:flex失效了,在自己本地以及在别人本地都是正常的,打包到线上之后就失效了,f12调试发现,display属性没了。出现这个问题的原因是代码经过打包之后元素的优先级变低或者被覆盖掉。也可以通过增加类名的方式,通过多个类名,精准定位到该元素。可以通过增加!important 解决。
2024-07-17 18:23:49 298
原创 element中el-table单元格x轴出现却不滚动的原因
vue2配套的element不能使用<el-scrollBar></el-scrollBar>标签,vue3可以,所以只能使用overflow-x,但是设置了overflow-x:scroll之后,x轴出现,但是没有发生滚动的情况,下面是我的解决方案。写项目遇到一个需求就是一个单元格内会放入多张图片,需要让x轴滚动方便查看一定宽高的图片。
2024-07-16 19:57:39 264 1
原创 vue3+ant-design-vue实现table单元行单击改变背景颜色
vue3+ant-design-vue实现table单元行单击改变背景颜色
2023-05-17 15:22:00 1496
原创 vue之中watch监听不到defineProps第一次传输的值的问题
原因总结:vue之中props传值是异步更新的,这就导致watch可能会监听不到第一次的值,需要使用watch里面的immediate进行深度监听,以便于watch能够立即触发回调函数得到监听的值的变化,这样就不会被异步所影响而监听不到。问题解决:发现这个问题之后,我首先查看defineProps传值是否正常,显示是为正常的,否则弹窗也无法有效的打开关闭,后来我在watch里面添加immediate:true进行深度监听,这样就使watch能够监听到第一次的值。
2023-05-15 14:50:26 2160
原创 vue3之中div盒子的滚动条随着内容的增加而自动向下滚动
思路:需要用到ref绑定dom元素,以及dom元素的scrollTop和scrollHeight属性,最终在onUpdated函数之中让scrollTop和scrollHeight两者相等即可。scrollTop:指的是滚动条卷去的距离(滚动条向下滚动之后距离顶部的距离)scrollHeight:指的是内容的高度。
2023-05-12 11:21:57 2335
原创 [vite] Internal server error: Preprocessor dependency “sass“ not found. Did you install it?
原因:出现这个报错信息是因为缺少sass预处理器依赖项。可以通过安装sass解决问题。
2023-05-12 10:30:34 1325
原创 ant-design-vue之中<a-table>标签自带的分页如何变为中文
a-table :pagination="pagination">自带的分页器默认语言是英文,但是需求需要变为中文,需要使用a-config-provider标签来将分页器变为中文。
2023-05-09 17:47:13 2044 1
原创 ant-design-vue之中<a-form>表单清空
如果我们给绑定的ref为formRef ,绑定的数据值为formState。清空表单的数据值要从两个地方清空。
2023-05-09 17:24:49 1828 3
原创 vue3和ant-design-vue的<a-form>表单自定义规则校验封装
【代码】vue3和ant-design-vue的<a-form>表单自定义规则校验封装。
2023-04-27 15:35:07 1932 1
原创 前端给div增加滚动条并改变滚动条样式
【代码】前端给div增加滚动条并改变滚动条样式。 overflow-y: auto;/*竖向滚动条*/ overflow-x: hidden;/*横向滚动条*/ &::-webkit-scrollbar
2023-04-27 14:43:55 269
原创 使用display实现页面根据浏览器窗口大小自适应
代码之中使用 flex-direction:row实现了左右两个盒子得水平排列,然后width占据百分比进行分割,这样页面就会根据浏览器窗口大小的变化实时的调整自身大小宽度。思路:使用display:flex实现页面效果。
2023-04-27 14:34:38 272
原创 在vue3里面使用时间转换插件moment
思路:引入moment.js库之后使用$moment保存库的对象然后使用defineExpose暴露$moment给需要使用moment的组件使用。更多Moment.js库的用法可以移步。
2023-04-26 11:21:49 1140
原创 vuex的数据持久化
将数据存放vuex中,在vuex的mutations模块将数据存放进sessionStorage里,再入口文件main.js文件中将之前存入sessionStorage中的token再存进vuex中,以此实现vuex数据的持久化
2023-02-09 16:15:29 643
原创 vue组件传值之事件总线
组件传值之事件总线(两种方法实现使用事件总线传值)除了上面这种初始时候在main.js之中直接将eventBus挂载到vue实例上面的方法,我们还可以是使用封装js文件的方法实现事件总线传值,
2023-02-08 17:31:03 774
原创 从数组中随机多次且不重复抽取其中一项
思路:使用 Math.floor(Math.random() * arrStr.length)随机抽取数组元素,抽取之后删除数组该项元素避免重复抽取。
2023-02-06 15:53:02 246
原创 使用css和js对字符进行限制,超出部分用省略号替代
1.首先使用css对单行字符进行限制。2.使用js对字符的数量进行限制,超出规定数量的就使用省略号替代。2.1 封装方法,方便复用。
2023-02-06 15:00:36 787
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人