![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
天高任鸟飞dyz
一名技术狂热追求者,一直在奔跑从未停止过。
展开
-
sse数据接收
SSE(Server-Sent Events):是一种基于HTTP的,以流的形式由服务端持续向客户端发送数据的技术。原创 2022-08-23 10:59:24 · 1620 阅读 · 0 评论 -
drone-js 接口文档
【代码】drone-js 接口文档。原创 2022-08-22 18:43:26 · 314 阅读 · 0 评论 -
vue全局节流处理
vue全局节流处理。原创 2022-08-15 16:10:26 · 283 阅读 · 0 评论 -
axios中断请求
axios中断接口请求原创 2022-06-29 15:07:15 · 1003 阅读 · 0 评论 -
列表加入计时器(正计时、倒计时)
列表加入计时器(正计时、倒计时),列表每一行都有独立计时!原创 2022-06-28 16:29:46 · 409 阅读 · 1 评论 -
vue大文件下载(下载进度展示)
vue大文件下载(下载进度展示) 提示框展示下载进度原创 2022-06-28 15:37:58 · 4833 阅读 · 0 评论 -
import、export、export default、as的使用
目录前言一、export二、export default三、as 示例1 示例2 示例3总结export 与import是es6中新增模块功能最主要的两个命令。 1.export与export default均可用于导出常量、函数、文件、模块等 2.在一个文件或模块中,export、import可以有多个,export default仅有一个 3.通过export方式导出,在导入时要加{ },export default则不需要{ }使用export抛出的变量需要用{}进行import原创 2022-06-10 15:19:26 · 2118 阅读 · 0 评论 -
vue3中如何使用this相关属性
vue3怎么使用this属性原创 2022-06-10 14:26:45 · 957 阅读 · 0 评论 -
vue全局注册组件
在components文件夹下新建index.js文件@/components/index.jsimport Vue from 'vue'// require.context 是webpack的一个apiconst req = require.context('./', true, /\.vue$/)// 全局注册req.keys().forEach((element,index) => { let name = element.replace(/(\.\/)|(\.vue)原创 2022-04-22 16:51:58 · 4697 阅读 · 0 评论 -
防抖(debounce)和节流(throttle)
一、防抖动作绑定事件,动作发生后一定时间后触发事件,在这段时间内,如果该动作又发生,则重新等待一定时间再触发事件。具体方法是:在上一次事件触发之后的time时间内如果事件没有再次触发,那么就在time时间后触发,否则将触发的时间作为新的起始点通俗理解就是,将密集的时间触发事件看作一个时间整体,整个整体只触发一次事件,密集的界定就是相邻事件触发时间小于time,则以这个整体的最后一次事件触发为起始点...原创 2021-11-10 11:52:03 · 3502 阅读 · 1 评论 -
Vue 强制页面刷新(provide 和 inject)
一、常规方法location.reload();this.$rotuer.go(0);存在问题:1.强制刷新页面,出现短暂的空白闪烁。2.h5页面在安卓机方法不兼容。this.$rotuer.go(0) 安卓、ios都不支持、pc支持 location.reload() 安卓不支持 、 ios支持、pc支持二、provide和inject实现页面刷新祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。1、在 App.vue 文件原创 2021-11-03 16:27:28 · 5932 阅读 · 6 评论 -
vue路由守卫 beforeEach、钩子
1、全局钩子2、某个路由独享的钩子3、组件内钩子1.全局钩子主要包括beforeEach和aftrEach,beforeEach函数有三个参数:to:router即将进入的路由对象from:当前导航即将离开的路由next:Function,进行管道中的一个钩子,如果执行完了,则导航的状态就是 confirmed (确认的);否则为false,终止导航。afterEach函数不用传next()函数这类钩子主要作用于全局,一般用来判断权限,以及以及页面丢失时候需要执行的操作,例...原创 2021-10-26 16:27:53 · 822 阅读 · 0 评论 -
element tree组件半节点回显问题
一、需求keys:[半选节点key+勾选节点key] 通过keys进行tree树回显节点为全选,则设置为全选。若改节点下未全部勾选,父节点设置为半全选。样式:keys:keys:[1,4,9]data:data: [{ id: 1, label: '一级 1', children: [{ id: 4, label: '二级 1-1', children: [{ id: 9, label: '三级 1-1-1' },原创 2021-09-02 13:03:09 · 755 阅读 · 0 评论 -
Vue响应式原理初探
一、数据侦测(一)侦测 Object1. Object.defineProperty(obj, prop, descriptor)该方法用于设置对象属性,其接受 3 个参数,第一个参数是需要定义的对象,第二个是需要定义的属性,第三个则被称为描述符。JS 中的对象身上有两种描述符,第一种是数据描述符,具有以下键值:configurable,用于描述数据的可配置性,是否可通过 delete 操作符删除,默认值为 false; enumerable,表示该属性是否可枚举,即可通过 for..原创 2021-08-16 14:41:45 · 144 阅读 · 2 评论 -
vue鼠标悬浮框
效果:html:<div @mouseenter="enter" @mouseleave="leave" @mousemove="move">鼠标触碰元素</div><div v-show="popUpShow" class="hover_con" :style="positionStyle">悬浮框</div>js:export default { name: '', data() {原创 2021-08-13 15:52:06 · 2188 阅读 · 0 评论 -
tinymce富文本编辑器(vue)
TinyMC编辑器简介TinyMCE是一款易用、且功能强大的所见即所得的富文本编辑器。跟其他富文本编辑器相比,有着丰富的插件,支持多种语言,能够满足日常的业务需求并且免费。TinyMCE的优势:开源可商用,基于LGPL2.1插件丰富,自带插件基本涵盖日常所需功能接口丰富,可扩展性强,有能力可以无限拓展功能界面好看,符合现代审美提供经典、内联、沉浸无干扰三种模式(详见“介绍与入门”)对标准支持优秀(自v5开始)多语言支持,官网可下载几十种语言。下图为开启全部功能的截图Tiny原创 2021-08-10 10:06:04 · 49187 阅读 · 16 评论 -
vue-qr生成二维码并下载
引入import vueQr from 'vue-qr'html原创 2021-08-04 23:23:44 · 719 阅读 · 6 评论 -
利用html2canvas截取div保存为png图片并下载
Html2canvas是什么?是一个脚本 这个脚本可以允许用户直接在浏览器上拍摄网页或其中一部分的"屏幕截图".屏幕截图是基于DOM,因此可能无法真实表示100%的准确度,因为它无法生成实际的屏幕截图,而是根据页面上的可用信息构建屏幕截图。运行过程?脚本遍历加载页面的DOM。它收集那里所有元素的信息,然后将其用于构建页面的表示形式。换句话说,它实际上并不截取页面的屏幕快照,而是根据它从DOM读取的属性来构建页面的表示形式。所以可能有些这个脚本识别不了的css或者html将会在编译过程中失效!原创 2021-07-30 09:36:01 · 1788 阅读 · 2 评论 -
vue 将xlsx表格转成json数据
HTML:<van-uploader :before-read="beforeUpload" :accept="'application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'"> <van-button icon="plus" type="primary">上传文件</van-button></van-uploader&g.原创 2021-06-17 15:52:34 · 689 阅读 · 3 评论 -
element DatePicker日期选择器控制可选时间段(一个月范围时间段)
定义export const formatMomentDayStart = function (day) { return moment().startOf('day').subtract(day, 'days').valueOf()}export const formatMomentDayEnd = function (day) { return moment().endOf('day').subtract(day, 'days').valueOf()}原创 2021-06-15 17:37:07 · 2663 阅读 · 10 评论 -
TSLint配置
{ "rules": { // TS特性 "member-access": true, // 设置成员对象的访问权限(public,private,protect) "member-ordering": [// 设置修饰符顺序 true, { "order": [ "public-static-field", .原创 2021-06-04 14:47:38 · 358 阅读 · 0 评论 -
.prettierrc文件常见配置
{ "semi": false, // 使用分号, 默认true "singleQuote": true, // 使用单引号, 默认false(在jsx中配置无效, 默认都是双引号) "bracketSpacing": true // 对象中的空格 默认true}原创 2021-05-31 15:37:38 · 424 阅读 · 3 评论 -
Vue clipboard(复制功能)
前言 clipboard.js是一款轻量级的实现复制文本到剪贴板功能的JavaScript插件。通过该插件可以将输入框,文本域,DIV元素中的文本等文本内容复制到剪贴板中 clipboard.js支持主流的浏览器:chrome 42+; Firefox 41+; IE 9+; opera 29+; Safari 10+;封装import Vue from 'vue'import Clipboard from 'clipboard'function clipboardSuccess...原创 2021-05-31 10:30:23 · 3136 阅读 · 0 评论 -
Tree 树形控件根据code过滤节点(Element+Vue)
项目场景:权限控制中根据登陆账号已有权限code 渲染tree的结构树。从而实现下级权限不能高于本级权限解决方案:DOM <el-tree :data="menuData" show-checkbox default-expand-all node-key="id" ref="tree" :props="defaultProps" @check="onCheck" > </el-tree>原创 2021-05-17 10:59:42 · 741 阅读 · 16 评论