自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(17)
  • 收藏
  • 关注

原创 使用ueditor上传附件(pdf, mp4等)可直接预览

最近遇到一个需求,在使用富文本框编辑文章内容时,需要上传附件,同时上传的这个附件需要以附件的格式或者直接预览的方式展现。

2024-06-26 18:00:54 607

原创 vue中根据文件地址实现预览excel文件

前端根据文件地址处理excel文件预览

2024-04-12 15:50:43 882

原创 vue2 自定义移动端日历日程组件 可切换年月日周

一个可以切换年月日周的日历日程组件,用于展示在移动端提供日程服务,点击对应日期展示对应日程

2024-01-05 11:22:44 2002 2

原创 vue 无需任何插件 使用draggable实现 拖拽移动dom 拖拽排序等

在这里面需要注意的是:拖拽放下的事件需要使用@dragover触发的事件中阻止默认行为,否则并不会触发@drop事件。我们可以看到拖拽放下的事件中用到了生成dom并插入的方法,但是我们用了vue开发其实可以不用这样,可以定义一个展示数组,通过操作这个数组的行为来在模板中动态展示列表。当然,这个可以实现操作的并不完全仅限于拖到另一个dom,在开发中,我们也会有需求可以实现拖拽排序之类的功能。最近在一个需求中遇到一个需要实现一个拖拽某行数据到一个列表中,从而在对应的列表中展示该被拖拽行的数据!

2023-12-29 16:36:43 755 1

原创 2023双旦 跨年烟花 html+canvas实现(附源码)

双旦即将到来,之前在短视频平台看到3d烟花的效果,遂在网上找了一套烟花的源码,下面跟大家分享一下,下面是视频效果,代码放在下面了!!!HTML5+Canvas漂亮的3D烟花2024跨年特效可以获取代码直接运行!下面有几点需要注意修改的地方,不然可能运行不太流畅。

2023-12-21 10:24:04 4507 9

原创 不要只会使用console.log

console 是 JavaScript 内的一个原生对象,内部存储的方法大部分都是在浏览器控制台输出一些内容,并且还提供了很多的辅助方法。我们在前端开发的过程中,进行项目调试常常会需要打印输出在控制台,往往都是使用console.log但是除了console.log,还有其他的,下面我将为大家罗列一下比如我们在vscode中输入console.会自动联想后面的内容可见console提供了如此之多的方法。

2023-12-19 11:22:18 378 1

原创 在vue中使用jsonp+promise处理跨域问题

因为回到上面最开始讲的, `<script>` 标签没有访问 DOM 的权限,但是可以跨域请求并不受同源策略的限制,其他 HTTP 请求方法(如 POST、PUT、DELETE)通常需要访问 DOM,因此受到同源策略的限制。首先,我理解的jsonp的原理简单来说就是在window上创建了一个脚本函数。利用浏览器对<script>标签引用外部资源不受同源策略限制的特性,执行了改脚本函数从而获取到对应的东西!下面是我使用jsonp+promise封装的一个函数,可以轻松像正常请求接口一般使用。

2023-12-15 13:52:43 152

原创 前端实用网站(备忘)

旨在为零基础 Web 开发初学者提供指导和开始编写网站代码所需的所有内容。5.稳定、快速、免费的前端开源项目 CDN 加速服务。在前端开发中非常实用的一些网站地址。

2023-12-12 11:16:42 371

原创 vue项目使用webpack打包后部署到服务中无法读取静态资源

在打包vue项目时,因为通过脚手架生成的项目,部署到服务中会出现读取静态资源404的情况

2023-12-11 17:18:37 1501 1

原创 20 个眼前一亮的一行 JavaScript 代码

你可使用 window.scrollTo(0, 0) 方法自动回到顶部。使用 navigator.clipboard.writeText 轻松将任何文本复制到剪贴板上。通过使用 document.cookie 可以轻松清除存储在网页中的所有 cookie。使用 Math.random 和 padEnd 属性生成随机的十六进制。Javascript 没有内置的大写函数,因此我们可以使用以下代码。使用 document.cookie 来获取 Cookie 的值。使用以下代码检查用户的设备是否处于暗模式。

2023-11-10 10:05:31 42 1

原创 webpack解决跨域(仅开发环境)

在开发环境中,Webpack 可以结合开发服务器(如 webpack-dev-server)提供代理功能来解决开发过程中的跨域问题。但对于生产环境,由于 Webpack 主要是用于打包和构建前端资源,不直接处理服务器端请求,因此不能直接解决生产环境的跨域问题。注意,如果在代理配置中设置了changeOrigin为true,则在代理请求时会自动将请求头中的Host字段设置为代理目标的域名,这样就可以绕过浏览器的同源策略,实现跨域请求。Webpack 本身并不能直接解决生产环境的跨域问题。

2023-07-31 16:07:05 1826 1

原创 巧用递归函数处理循环树形结构数组

需求:首先要将每一级的nodeName与上一级的拼接起来形成一个完整的名称,最后一级的子对象还要判断其tags中是否存在第一级的areaCode,若存在,则将其取出组成一个新的数组(需要数组扁平化),最后组成新的结构返回!背景:在开发的时候遇到一个需求,后端传过来是一个树形结构数组,一层一层嵌套子级数组;这个时候需要确认最后一级里面对象中tags字段(tags:'bg001,bg002,bg003')这样格式!巧妙解决有很多层级的数据,而不用写死循环的次数!一开始我的处理是调接口之后很呆的去手动循环三次。

2023-06-02 16:51:09 276

原创 创建vue项目的几种方法

3.使用vue init webpack创建,打开终端输入vue init webpack+(项目名称)即可创建。2.使用vue create创建,打开终端输入vue create +(项目名称)即可创建。打开终端输入npm install -g create-vite-app。1.使用可视化插件vue ui创建 打开终端输入vue ui进入图形化管理直接操作创建。这样能创建一个框架,之后需要router,vuex之类的再自行安装即可!4.使用vite创建,需要装vite构建工具,

2023-05-24 14:45:43 697 1

原创 爷父子组件间传值

子组件修改父组件值---》 this.$emit('update:selectedHouse', newd) // newd为目的值。现在需要一个级联选择树,在最后一级的父级需要设置一个多选按钮,点击之后将该级的最后一级全选,并展示在最外层调用该级联选择数的组件上!并且在父子组件(共三个页面我将其称呼爷、父、子 以作区分)均报此错误!后面还是在爷组件与子组件使用了。但是在最后的一个组件内原地调用该组件,形成一个循环组件调用!因为父组件向子组件传值,子组件不能修改父组件的值,所以我使用emit传值。

2023-04-23 20:16:14 81 1

原创 vue-pdf预览报错RenderingCancelledException:Rendering cancelled, page

浏览了很多资料,这个其实是vue-pdf的bug,也看一个博主推荐git上大家讨论的。后面尝试了来个偷天换日,给个定时器解决了!但是没有实质性的解决方案!

2023-04-11 14:20:07 1844 8

原创 vue中对table表格相同内容行的合并

在vue开发中会有对表格的操作,有时因为需要遍历的情况不同,对于数据相同行处理时,使用element的table不太好实现,还是使用html的table标签!

2022-07-20 11:29:16 3276

原创 vue项目引入json数据!

在项目中我们在引入自己写的json数据,可以通过json-server方法将json文件转化为一个端口号引入!但是使用该方法前需要导入node的一个模块!json-server可以直接把一个json文件托管成一个具备全RESTful风格的API,并支持跨域、jsonp、路由订制、数据快照保存等功能的 web 服务器。然后在json文件目录下,运行json-server --watch --port 3001 data.json指令通过启动json-server服务并侦听data.json,.

2021-10-25 09:29:34 2821

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除