- 博客(12)
- 收藏
- 关注
原创 vue中src中图片引入失败问题及解决方案
在生产构建时,Vite 才会进行必要的转换保证 URL 在打包和资源哈希后仍指向正确的地址。然而,这个 URL 字符串必须是静态的,这样才好分析。首先请看图,通过url引入src下asset中point图片,发现页面并不显示marker标记点,图片地址也是正确的,为什么会加载不出来。图片通过import引入 保证图片是被加载,同时把值赋给url, 这样无论是在开发环境还是打包环境都可以进行正常访问。区别在于导入既可以使用绝对公共路径(基于开发期间的项目根路径),也可以使用相对路径。vite官方的解释是。
2024-08-16 10:29:15
319
原创 uniapp image图片显示问题
1.起初是认为在uniapp开发wx小程序是不允许采用加载本地资源的问题,发现可以在css样式中引入通过background-image:url()中可以显示出来问题,但是通过image去引入就发现图片显示不出来,报 “图片不能从本地加载”error。*在UniApp中,相对路径的解析也会受到框架的影响,因为UniApp将代码编译成小程序代码时可能会进行一些路径的转换。在小程序中,相对路径的解析可能会受到文件结构的影响,确保相对路径的正确性。在UniApp的项目结构中,将图片文件放在特定的目录(如。
2024-07-31 08:57:37
699
原创 uniapp定时任务熄屏时间不对解决方案
通过生命周期去解决,先在onHide 页面隐藏的时候存储当前离开时间和定时器倒数时间可以通过localstorge,在onShow及页面展示获取当前时间,进行时间比对,如果有剩余时间就继续倒计时 如下图所示。在使用uniapp中 setTimeout setInterval 应为在后台app的节省保存机制,会导致定时器的任务延缓。以上代码时错误示范,采用setInterval进行熄屏时间倒计时,会出现时间加快的现象。解决方案采用setTimout 进行时间倒计时 注意if else 里面条件放置。
2024-07-30 13:32:31
424
原创 底部吸顶几种方式实现
第二种方法 采用计算属性进行计算 内容区域通过calc计算 总高度为100vh 减去footer高度。第一种 采用content 内容区margin 取负值。第三种 采用flex布局。
2024-07-26 15:09:54
186
原创 import和require的区别
输出缓存:import语句会在内存中创建一个只读的引用,多次导入同一个模块不会重复执行该模块的代码。require语句会将导入的模块缓存起来,多次导入同一个模块会返回同一个导出对象,避免了重复执行模块代码的开销。require可以引用模块中的任意一个成员,包括导出的成员、默认成员、以及通过module.exports导出的内容。引用方式:import是静态引用,需要在模块的顶部引用,而且不能在代码中动态引用。语法:import是ES6中的模块加载语法,require是Node.js中的模块加载语法。
2024-07-25 14:33:35
309
原创 Babel】排除某些不进行转化文件写法
这样配置后,对于src目录下的所有.js文件,使用了@babel/plugin-transform-modules-commonjs插件进行转换。使用exclude参数:可以通过在 Babel 配置中指定exclude参数来排除特定的文件或目录,让 Babel 不对其进行转换。使用override参数:可以在 Babel 的配置文件中,针对特定的文件或目录使用不同的转换规则,来实现对部分属性不进行转换。使用ignore参数:类似exclude,但是会忽略指定的文件或目录,不会进入解析阶段。
2024-07-25 14:29:43
156
原创 canvas画布
Canvas元素是在HTML5中新增的标签用于在网页实时生成图像,并且可以操作图像内容,基本上它是一个可以用JavaScript操作的位图(bitmap)【像素图】。Canvas 由一个可绘制区域HTML代码中的属性定义决定高度和宽度。JavaScript代码可以访问该区域,通过一套完整的绘图功能的API生成动态的图形。为什么要去学习Canvas???2014年发布HTML5,至今10年已久,还有必要学习嘛???
2024-07-24 15:43:52
954
原创 js中空字符串和null的比对
空字符串是一个长度为 0 的字符串,它是一个有效的字符串,代表着没有任何内容。而null 则表示没有任何值。两个比较返回值都是e。
2024-07-24 09:24:09
89
原创 git 防冲突提交解决方案
然后再 将你自己的改动取出, git stash pop。首先将自己的修改暂存,git stash。其次拉取对方修改的代码,git pull。
2024-07-23 15:38:11
106
原创 外部点击icon 展开对应的菜单子菜单
最开始的想法是通过el-menu自带的defaultOpeneds考虑维护一个响应式的数组,用于存储应该展开的子菜单的 index,然后在 el-menu 的 defaultOpeneds 属性中使用这个数组。然而现实是残酷的,写完发现defaultOpeneds 是一个只读属性,你不能直接修改它来控制子菜单的展开而且它也只是在挂载组件加载一次。重点来了,在el-menu中如何使用,在原本代码封装的动态菜单就不过展示,主要这里采用的tsx语法。el组件有提供的方法控制菜单的展开和收起方法。
2024-07-23 15:34:38
726
原创 vue3中自定义指令实现table表格自适应高度
本文主要是针对vue3开发而写的,首先我们需要引入App,vue3的挂载都是在App上的,然后创建一个指令并默认导出,resize是指令的名称,resizeHeightDirective是实现指令的方法。在日常前端开发中,希望表格能够自适应不同的屏幕的大小高度,同时页面进行缩放的同时,表格也需要进行同时适配不同的屏幕大小,下面以elementuiPlus组件的table表格为例子。然后在全局挂载加载这个指令,就可以使用了, 我这里多封装了一层,放在了Directive文件夹下,方便后续文档管理。
2024-07-22 10:21:38
1359
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人