![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue功能代码
echo忘川
有问题可联系QQ:806020881
展开
-
vue在光标处加入内容
vue如何在光标处插入文字原创 2022-11-10 10:45:03 · 1084 阅读 · 1 评论 -
vue开发实现单选多选功能
vue开发复选框实现单选、多选、反选功能1.全选: <input type="checkbox" v-model="checkAll" @click="handleCheckAll" />序号2.单选: <input type="checkbox" v-model="checkList" v-bind:value="item.AllocationNo" />{{ ...原创 2019-10-10 12:00:34 · 1096 阅读 · 1 评论 -
可拖拽效果
最近要做拖拽相关的功能,想着之前在轮子工厂看到过,准备直接用组件来完成。相关组件:vue-draggable-resizable 用于可调整大小和可拖动元素的组件并支持组件之间的冲突检测与组件对齐github链接但是由于需求并不需要整个工具栏都能拖拽,而是点击图标拖拽一整个工具栏,如图:组件中没有找到需求对应的解决方法(如果有的话留言一下 我加上去)因此,我采用的原生的方法,思路是:点...原创 2020-01-09 18:27:43 · 350 阅读 · 0 评论 -
mammoth.js/sheetjs/vue-pdf内网文件的预览问题
文章目录一、word预览--mammoth.js二、excel预览--sheetjs三、pdf预览——vue-pdf前端小功能:Word,PDF,Excel文档vue预览最新需求需要内网环境进行预览,pdf可以直接使用浏览器自带的方式进行预览,但是word和excel需要借助插件,预览本地文件,或者是内网文件,可以使用以下方法进行预览:PDF:Vue-pdfWord: mammoth.jsExcel: SheetJS一、word预览–mammoth.js安装:npm install --sav原创 2020-09-08 18:23:29 · 9529 阅读 · 34 评论 -
表头纵向排列
文章目录一、基于elementUI实现的表头纵向排列效果:代码:<template> <div> <el-table :show-header="false" :data="tableData" border style="margin: 20px;width:381px " > <el-table-column width="180原创 2020-08-06 16:57:57 · 3761 阅读 · 1 评论 -
pdf添加水印
文章目录一、vue-pdf二、pdfh5一、vue-pdf在项目开发过程中,如果我们只需要展示pdf,那么我们可以选择vue-pdf,可以查看我之前的一篇但是现在的需求是需要显示带水印的pdf出来,这就存在一个问题,vue-pdf会屏蔽签名图层,导致显示不出来水印。解决方案一:我在issues上看到有人提出了这个问题。issues地址解决方案是直接修改pdf.work.js的源码,全局搜索AnnotationFlag.HIDDEN:// if (data.fieldType === 'Sig'原创 2020-09-25 10:50:11 · 1204 阅读 · 0 评论 -
vue视频播放——vue-video-player
文章目录一、安装二、使用三、效果一、安装github地址安装:npm install vue-video-player --save引入:import VueVideoPlayer from 'vue-video-player';import 'video.js/dist/video-js.css'//自定义样式import '@/assets/styles/video.css'样式文件(这个地方也可以写自己的默认样式):/* 视频开始的按钮样式 */.video-js .vjs原创 2020-09-25 09:49:09 · 559 阅读 · 0 评论 -
树的删除和修改以及上下移动(不调用刷新树的接口)
涉及到树的操作最好转化成扁平的数据格式进行处理(处理参考链接),如果没有处理成扁平数据的格式的话,可以参考以下内容(内容基于vxe-table组件):1.删除树的节点后更新树的显示//批量删除菜单 handleRemoveRow(row, rowIndex, $rowIndex) { this.$confirm('请选择是否删除?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消',原创 2022-05-23 15:49:31 · 439 阅读 · 0 评论 -
使用自定义指令给前端页面或图片或视频添加水印
文章目录一、新建 watermark.js二、min.js 引入 watermark.js三、调用指令一、新建 watermark.jsimport Vue from 'vue'Vue.directive('watermark', (el, binding) => { function addWaterMarker(str, parentNode, font, textColor) {// 水印文字,父元素,字体,文字颜色 var can = document.create原创 2020-10-14 16:19:51 · 2545 阅读 · 3 评论 -
video重写控制条——解决video全屏层级最高问题
文章目录一、页面的HTML部分二、css部分三、暂停功能/播放功能四、全屏功能五、当前时间和总时间的显示六、进度条拖动功能七、播放结束时候的处理八、data部分九、结语全屏video会在最上层,这个时候设置定位或者z-index都是无效的,按照有些博客中的z-index设置成2147483647也没用,x5-video-player-type="h5"也没用,于是决定重写控制条。经过分析,简单的重写控制条的话,有这么几个功能点:1.暂停功能/播放功能播放时进度条跟随功能播放时时间改变功能暂停时原创 2020-10-27 15:10:11 · 4785 阅读 · 3 评论 -
vue添加自定义右键菜单
一、写原生方法1.在所编辑的页面,需要添加右键菜单的元素,绑定contextmenu事件,如下: <li v-for="item in resourceList" :key="item.id" @click="handleClickFolder(item)" @contextmenu.prevent="openMenu($event,item)" >原创 2020-06-28 16:38:22 · 13553 阅读 · 15 评论 -
浏览器的ctrl+f的搜索功能
<vxe-column field="name" title="菜单名称" tree-node show-overflow="title"> <template #default="{ row }"> <div class="ellipsis"> <i :class="'iconfont ' + row.icon"></i>原创 2022-05-24 11:01:43 · 1443 阅读 · 1 评论