第一步:安装//excel文档预览组件
npm install @vue-office/excel第二步：获取base64编码，存入sessionStorage并通过router.resolve 结合 window.open 打开新窗口（参考文章--参数传递）let baseContent = res[0].data.Base64Content//获取后端返回的base64编码
//使用s
对于前端开发者而言，javascript正扮演着越来越重要的地位，它不仅能为浏览器端赋能，在web服务器方面也有很大的价值(我们可以用nodeJS来写服务端代码，启动web服务器)，因此本文所要描述的，便是javascript在服务端的应用。我将介绍如何使用nodeJS来搭建一个mock服务器，方便前端自定义mock数据请求，提高前端开发的主观能动性和对项目健壮性的探索。我们将学到koa基本使用k
最近的业务中涉及到这样一个需求，在线培训的系统需要知道用户对某个在线预览的页面追踪用户的预览时长。初步我们首先想到借助 Vue 页面的生命周期函数 mounted 和 destroyed，分别在其中加入开始计时和清除计时的逻辑，通过后台的接口上报对应的培训素材的时间数据，即可达到目的。有了思路，我们就可以开始筹划具体的代码实现。定义开始结束计时函数在 dat
转载
2024-07-02 20:57:35
146阅读
Vue实现Excel预览功能前言：项目中经常能遇到要求预览excel文件的需求，下面分享一下常用的方法以及可能遇到的问题。使用场景：通过解析excel功能，实现PDF导入时的预览首先我们用到了**XLSX（sheetJs）**这个库来处理Excel类型的文件地址：https://docs.sheetjs.com/https://www.npmjs.com/package/xlsx支持大部分的现代浏
原创
精选
2023-09-07 10:34:07
1077阅读
vue实现图片预览的放大以及缩小--viewer.jsviewer.js在vue项目中如何使用viewer.js注意： viewer.jsviewer.js是一款开源的图片预览插件，功能十分强大:支持移动设备触摸事件、响应式、放大/缩小、旋转（类似微博的图片旋转）、水平/垂直翻转、图片移动（拖拽）、全屏幻灯片模式（可做屏保）、缩略图 以及多种自定义事件在vue项目中如何使用viewer.js安装
1. 介绍 在现代 web 应用程序中，图片预览功能提升了用户体验，使用户可以在上传图片之前查看图片内容。本文将详细介绍
在现代 web 应用程序中，图片预览功能提升了用户体验，使用户可以在上传图片之前查看图片内容。本文将详细介绍如何在 V
原创
2024-09-18 11:02:22
445阅读
我们今天所看到的网页，越来越丰富多彩，是因为添加了各种各样的图像，对于网页进行了美化。当前万维网上流行的图像格式有：GIF、JPEG及PNG等，各自的特点可自行百度。1.添加图像语法：<img src="图像文件的地址"/>2.图像大小与边框在网页中直接插入图片时，图像的大小和原图是相同的，而在实际应用时可以通过各种图像属性的设置调整图像的大小、分辨率等内容。（1）调整图像大小语法：&
转载
2024-10-13 19:13:32
83阅读
Vue时间线组件效果背景 项目需要用到时间线组件，用于选择同一笔记不同时期的内容。一开始打算用elementui的组件，但不适合，于是网上搜了个遍，却没找到合适的，因此自己动手写了个，并记录下来当做vuejs的学习笔记。步骤一、创建项目环境略。。百度二、创建组件略，没啥说的，就是新建了个.vue文件三、写代码1）写出大概的框架每个时间段都是如上图所示的结构，左边部分是时间线，右边是内容。组件模板
转载
2024-03-10 13:44:39
3238阅读
要实现这个功能其实并不难,element组件直接用就可以, 但是我在使用过程中碰到了几个坑,就记录下来,分享给大家,避免落坑,话不多说,直接上过程...... 表单校验功能: 实现这个功能,总共分为以下4布: template代码: data定义数据代码: methods方法代码: 注意点:①定义p
原创
2022-01-13 16:26:26
177阅读
什么是SEO搜索引擎优化(Search engine optimization，简称SEO)，指为了提升网页在搜索引擎自然搜索结果中(非商业性推广结果)的收录数量以及排序位置而做的优化行为，是为了从搜索引擎中获得更多的免费流量，以及更好的展现形象。SEM(Search engine marketing，搜索引擎营销)，则既包括了SEO，也包括了付费的商业推广优化。本文主要介绍的是前端如何
转载
2024-10-23 07:18:13
39阅读
项目中遇到了要打印页面的功能,我感之前使用的是一个第三方的插件,但是不兼容IE,后来发现直接调用window的API就可以了,MMP 然后有不想在打印页面里面显示的元素,直接通过CSS样式控制就行了
原创
2022-01-13 16:26:25
658阅读
template的代码： //搜索框 <el-input placeholder="请输入..." v-model="keyword" ></el-input> <button @click="search">搜索</button> //内容 <div v-for=(item,index) in l ...
转载
2021-10-11 10:38:00
689阅读
2评论
ElementPlus按需导入1.安装pnpm add element-plus 2.配置按需导入：官方文档：快速开始 | Element Plus按照官网按需导入中的自动导入步骤来进行pnpm add -D unplugin-vue-components unplugin-auto-import观察Vite代码与原vite文件的差别，将原vite文件中没有的，复制粘贴到合适的位置3.直
一、下载安装C-LODOPhttps://www.lodop.net/download.html 解压文件后点击exe程序，启用服务 将上述的 LodopFuncs.js 文件放到工程某个文件下 二、修改LodopFuncs.js文件并对该文件做一点点小的处理，以下是自己的处理。该插件可直接放在前端工程文件下
转载
2024-03-29 12:16:26
375阅读
项目中老大心血来潮设计了一可以拖动达到排序的功能,感觉没什么用,但是没办法,实现吧! 这功能肯定不会手撸了,直接上插件 使用Sortable.js,对vue不友好,拖拽有时候乱跳;改用vuedraggable插件,此插件依赖Sortable.js. 教程地址:https://blog..ne
原创
2022-01-13 16:27:03
723阅读
前戏 现在会员管理就差一个功能没有实现了，那就是删除会员的功能。 删除二次确认对话框 实现效果如下 之前我们已经写好了删除按钮，并且定义好了删除方法 handDelete 现在就来实现这个方法，在实现之前先写好我们的接口 在 src/api/member.js 里写delete请求，完整代码如下 /
原创
2022-07-07 10:47:53
359阅读
单条数据查询 当我们进行编辑会员的时候，要将之前输入框的内容填充到输入框内，所以需要有个单独的接口，通过id查询出会员信息，接口地址如下 http://127.0.0.1:8081/api/manage/member?id=48 当成功的时候返回的如下 { "code": "2001", "succ
原创
2022-07-07 10:49:15
198阅读
此文仅记录本人在搭建后台系统过程中遇到的难点及注意点，如果能帮到各位自然是极好的~~~ 项目主要架构：vueJS、elementUI、scss 一、项目初始化首先需要安装nodejs，安装方法就不在赘述，关于 npm 下载速度慢的问题的解决办法：如果安装了cnpm，要先清除：cmd运行 npm uninstall cnpm -g 清除淘宝镜像cnpmcm
打印也是需要技巧滴，一些简单实用的excel打印技巧送给你！1、每页都打印相同标题在打印时，第一页有标题，第二页及以后没有标题，造成阅读不便，如何使每页都打印相同标题呢？【页面布局】→【打印标题】 【工作表】→【顶端标题行】→【确定】 在此提醒一下：不能在打印预览窗口中的【页面设置】中设置如下图所示是灰色的，不能进行设置。 2、打印选定区域【选中要打印的区域】→
