- 博客(23)
- 收藏
- 关注
RSS订阅
原创 vue前端预览pdf并加水印、ofd文件，控制打印、下载、另存，vue-pdf的使用方法以及在开发中所踩过的坑合集
根据公司的实际项目需求，要求实现对pdf和ofd文件的预览，并且需要限制用户是否可以下载、打印、另存pdf、ofd文件，如果该用户可以打印、下载需要控制每个用户的下载次数以及可打印的次数。正常的预览pdf很简单，直接调用浏览器的预览就可以而且功能也比较全，但是一涉及到禁止用户打印、另存的话就不可以用浏览器自带的预览方式了。那就只能寻找插件来模拟了，之前在eletron-vue项目中使用过pdfjs以及vue-pdf插件，效果不是特别好
2023-06-21 14:39:14
20833
4
原创 vue前端实现将页面显示内容生成pdf文件的几种方法，html2canvas、dom-to-image、jspdf（带分页）基本使用以及介绍
不用多说，vue前端的框架，echarts用来根据数据生成的带有样式效果的图表；html2canvas与dom-to-image都是将界面上的dom生成图片。
2023-03-01 14:34:46
7918
1
原创 File、FileReader、Base64、Blob基本使用以及Buffer、ArrayBuffer之间的转换
type: 当前的输入类型文件ref: 相当于当前input的唯一标识accept：指定上传文件的格式 word或者pdf。
2023-02-09 14:05:47
3273
原创 修改video标签默认样式问题video播放器样式优化；video播放器默认显示图片
需求：1.播放器可以支持上传默认封面图片2.播放器的进度条长度拉长些,与播放器长度一样长，或者其他方式美化一下首先需求1.播放器可以支持上传默认封面图片解决方案：1.第一种方法可以直接在video标签中直接添加poster属性<!DOCTYPE HTML><html><body><video src="/i/movie.ogg" controls="controls" poster="../../imgs/poster.png">you
2021-12-07 10:13:06
10260
原创 【实际场景】基于vue2-editor富文本编辑器，实现将带有style的html片断加入到文章的指定位置
利用Vue2-Editor组件，实现一个富文本编辑器，允许用户编辑文章内容，包括文字样式和格式。增加一项新功能：用户可以通过鼠标选择文章中的任意段落，并通过鼠标右键触发文章续写功能。
2024-07-26 14:54:17
618
原创 国产系统中Firefox ESR52.3.0低版本火狐浏览器vue项目打包后兼容问题总结
随着国产操作系统的兴起，越来越多的企业和单位开始使用这些系统。然而，在这些系统中，浏览器的兼容性往往成为了一个不可忽视的问题。最近我们在给某单位做项目，他们的线上环境基本上全都是基于国产的操作系统。我们在使用Firefox ESR52.3.0这个低版本的火狐浏览器进行vue项目打包后的访问时，遇到了一些兼容性问题。本文将对这些问题进行总结，并分享一些解决方案。
2024-06-18 13:28:22
1331
原创 前端之旅中的小插曲：npm install 报错解决纪实
通过这次解决 npm install 报错的经历，我深刻体会到了前端开发中的细节之重要。一个小小的版本号、一个缓存文件、甚至是一个不同的包管理工具，都可能影响到项目的顺利搭建。同时，我也意识到在遇到问题时，系统地排查和尝试是解决问题的关键。从网络到环境配置，再到具体的项目文件，每一步都不能忽视。在未来的前端之旅中，我相信还会遇到更多类似的小插曲。但有了这次的经验，我相信自己能够更加从容地面对挑战，享受解决问题的乐趣。而每一次的解决过程，也将成为我成长道路上的宝贵财富。
2024-02-23 09:10:00
1076
原创 前端开发中的令人膛目结舌的代码技巧
在前端开发中，我们经常会遇到一些令人膛目结舌的代码技巧。本文将介绍一些在前端平时的项目开发中常用的令人膛目结舌的代码技巧，并用实际场景和代码举例说明。在实际项目中，我们经常会遇到需要对数组进行处理的情况，比如筛选出符合条件的元素。在前端开发中，我们经常需要拼接字符串来生成动态内容，传统的做法是使用加号来连接字符串。事件代理是一种利用事件冒泡机制，通过指定一个公共的父元素来监听所有子元素的事件，从而简化事件处理的方法。在前端开发中，我们经常使用模块化来提高代码的可维护性。
2023-12-22 13:13:01
511
原创 前端XSS攻击场景与Vue.js处理XSS的方法：vue-xss
在前端开发中，跨站脚本攻击（XSS）是一种常见的安全威胁。本文将介绍前端跨站脚本攻击（XSS）的场景以及在Vue.js框架中如何处理XSS的方法。通过了解这些内容，我们可以更好地保护前端应用程序的安全性，防止恶意攻击。一个开箱即用的Vue.js插件，可通过简单的方式防止XSS攻击。
2023-12-21 13:16:25
4602
原创 使用npm进行前端开发：基础知识与实践
npm是Node Package Manager的缩写，是Node.js官方提供的包管理器。它允许开发者轻松地安装、更新和管理Node.js模块和包。在前端开发中，npm常常用于管理项目依赖、构建工具和自动化任务，极大地提升了开发效率和生产力。
2023-12-21 11:11:02
1354
原创 vue3使用组合式api将时间戳格式转换成时间格式（2023年09月28日 10:00）
在上面的代码中，我们使用了ref来创建一个响应式的timestamp变量，它存储了13位时间戳。在上面的代码中，我们使用ref来创建一个响应式的items变量，它存储了一个包含3个对象的数组，每个对象都有一个13位时间戳字段。在模板中，我们使用v-for指令来遍历items数组，并在每个对象的元素上展示原始时间戳和格式化后的日期。在展示格式化后的日期时，我们调用了formatDate函数，并将13位时间戳作为参数传入。这样，当我们运行上面的代码时，就可以在界面上看到每个对象的原始时间戳和格式化后的日期了。
2023-10-09 13:26:51
2618
原创 vue3新特性 多方面总结vue3.0新特性
Compostion api 代替了 Option api ，Compostion API 中时根据逻辑相关组织代码的，提高可读性和可维护性性能比Vue2.x快1.2~2倍；按需编译，体积比vue2.x更小响应式 Proxy 代替 Object.defineProperty对 typescript 支持更好，更先进的组件接下来介绍一下vue3具体都有哪些新特性？.Composition API：组合API，类似React Hooks.Performance：性能比vue2.x块1.2～2倍。
2023-09-22 09:05:08
107
原创 JS时间戳转换、日期字符串转时间戳；JS处理数组时常用的方法以及场景
19.有一个数组里面有的对象有jsid 字段，有的没有jsid 字段，利用Js怎么筛选出这个数组中带有jsid 字段的对象？21.在js中，怎么根据一个数组中的所有id去另外一个数组中查询出所有相同id的数据？20.假设你有一个包含对象的数组，并且你想要修改数组中的某个对象的一个属性。18.JS将一个字符串分割成数组。15.JS中findIndex的使用。14.JS读取数组的尾部元素的方法。16.VUE中动态获取当前时间。17.vue 动态三元绑定类名。6.js中日期字符串转时间戳。'的考试成绩不及格'
2023-09-15 09:17:27
1912
原创 vue中理路由router的介绍以及使用方法
特别注意：路由携带params参数时，若使用to的对象写法，则不能使用path配置项，必须使用name配置！©摘自尚硅谷张天禹Vue2.0+Vue3.0全套教程丨路由课件。实现切换（active-class可配置高亮样式）作用：让不展示的路由组件保持挂载，不被销毁。 作用：让路由组件更方便的收到参数。分类：全局守卫、独享守卫、组件内守卫。配置路由，声明接收params参数。实现路由跳转，让路由跳转更加灵活。作用：可以简化路由的跳转。作用：对路由进行权限控制。
2023-02-15 09:17:21
140
原创 electron中使用adm-zip将多个excel文件压缩进文件夹，使用XLSX以及XLSXStyle生成带样式excel文件
electron环境下想要实现根据多个表生成多个Excel文件，打包存入文件夹内并压缩下载到本地。
2022-12-27 15:35:34
583
原创 vue中插槽slot的使用方法及介绍
插槽就是相当于在子组件里提供一个占位符给父组件使用，用表示，在父组件可以在这个占位符中填充模板代码组件等，填充在子组件当中。插槽用于决定将所携带的内容，插入到指定的某个位置，从而使模板分块，具有模块化的特质和更大的重用性。插槽显不显示、怎样显示是由父组件来控制的，而插槽在哪里显示就由子组件来进行控制。...
2022-08-03 08:59:28
497
原创 如何用CSS实现左侧宽度固定，右侧自适应（两栏布局）？左右固定中间自适应（三栏布局）呢？
在前端日常布局中，会经常遇到左侧宽度固定，右侧自适应或者左右两边固定，中间部分自适应的实用场景。本文例子中将列举出两种常用的两栏布局，左侧固定右侧自适应的常用方法以及代码和五种左右固定中间自适应的常用方法以及代码具体实现效果展示如下：1.二栏布局-flex弹性布局<!-- flex弹性布局 --> <div class="title">flex弹性布局：</div> <div class="box1"> <div class=.
2022-05-05 19:48:26
1594
原创 SASS使用方法环境配置 Ruby安装以及sass常用mixins举例 静态页使用方法
Sass介绍：Sass 是一个 CSS 预处理器。是 CSS 扩展语言，可以帮助我们减少 CSS 重复的代码，节省开发时间并且完全兼容所有版本的 CSS。Sass 扩展了 CSS3，增加了规则、变量、混入、选择器、继承、内置函数等等特性。生成良好格式化的 CSS 代码，易于组织和维护。文件后缀为 .scss为什么使用Scss？CSS 本身语法不够强大，导致重复编写一些代码，无法实现复用，而且在代码也不方便维护。Sass 引入合理的样式复用机制，增加了规则、变量、混入、选择器、继承、内置函数等等
2021-12-08 17:41:47
480
原创 pubsubjs介绍以及基本使用方法介绍
什么是PubSubJS？PubSubJS 是一个用 JavaScript 编写的基于主题的 发布/订阅库。PubSubJS 有同步解耦，所以主题是异步发布的。这有助于使您的程序保持可预测性，因为在消费者处理主题时，主题的发起者不会被阻止。主要特点：无依赖同步解耦ES3 兼容。PubSubJS 应该能够在任何可以执行 JavaScript 的地方运行。浏览器、服务器、电子书阅读器、旧手机、游戏机。AMD / CommonJS 模块支持不修改订阅者（jQuery 自定义事件修改订阅者）易于理
2021-12-06 10:43:49
8169
原创 高德地图/百度地图 api 根据select 选择地点 进行位置的显示；
需求：根据select 选择器选择城市地名切换地图位置变化预期效果：高德地图API：思路：根据高德地图api（概述-地图 JS API | 高德地图API）官方实例进行修改需要获取城市地点的adcode值和城市地点的名称通过AMap.Geocoder()进行获取相关信息，将adcode值和城市地点的名称通过.setCity 和修改代码：<select name="" id="courtNameSelect" class="selectClass" style="back.
2021-12-03 13:36:16
2107
时间线tab切换页 jquery-time
2023-09-01
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人