自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 解决echartsV5+ restore后echarts显示空白

echartsV5+ restore 空白

2025-05-12 14:47:02 225

原创 elementPlus el-date-picker 开始时间与结束时间 不可选时间限制

【代码】elementPlus 开始时间与结束时间 不可选时间限制。

2025-03-31 14:07:53 236

原创 在vue3+vite中使用SVG最全保姆级教程(以阿里巴巴图标库为例)

在vue3+vite中使用svg

2025-03-31 13:49:18 432

原创 解决yarn安装成功后提示不是内部或外部命令,也不是可运行的程序 或批处理文件

环境变量均已配置,但仍旧无法使用,可能是node升级过程中,node-sass出了问题,执行“npm rebuild node-sass” 再查看yarn -v 提示正确的版本信息号,问题解决。

2024-10-31 14:21:52 833

原创 el-date-picker 有效时间精确到时分秒 且给有效时间添加标记

【代码】el-date-picker picker-options selectableRange 有效时间精确到时分秒 且给有效时间添加标记。

2024-06-14 13:53:37 545 1

原创 自定义指令实现文本框正则校验--只能输入数字

/ 校验文本框--只能输入数字,且可以规定最小值,最大值/*** @param binding 可选,绑定表达式,允许输入{ min: 1, max: 10 }* @param vnode 虚拟dom*/// 不允许输入E} else {if (!!!// 双向数据绑定,为了避免出现文本框中显示的内容已被修改,但是提交的数据仍旧是旧数据的情况let _this = vnode.context // vnode.context上下文就是当前组件的 vue 实例。})

2024-03-06 10:06:22 593

原创 解决子元素的click事件会触发父元素的dbclick事件

通过taget来确定,只有target点击到父元素的时候,采取执行父元素的dbclick方法,下面的例子中,因为子元素覆盖到了父元素上,所以采用$event.target.parentElement来确定父元素。正确思路:要用子元素的dbclick事件的冒泡去阻止父元素的dbclick,子元素的dbclick方法为空。错误思路:通过阻止子元素click事件的冒泡,阻止父元素的dbclick。

2024-01-18 10:25:06 977 1

原创 前端项目继承,在A项目中继承base项目,使用vue2

项目管理、项目继承、vue2项目继承、subtree

2023-10-11 10:47:50 287

原创 js 筛选两个数组对象中的不同部分

es6 筛选两个数组对象中的不同

2023-05-13 11:44:09 1212

原创 audio报错DOMException: play() failed because the user didn‘t interact with the document first

封装一个包含自动播放,循环播放、暂停功能的Aduio组件

2023-04-03 09:55:59 14281

原创 element-ui el-transfer添加拖拽排序功能

【代码】element-ui el-transfer添加拖拽排序功能。

2023-03-24 17:39:59 2274 2

原创 从后台读取以文件流的形式加载图片

后台返回文件流,前端读取文件流并加载图片

2022-08-09 11:16:02 250

原创 el-form按照条件去加载表单验证

el-form 表单验证 有的字段显示与否是有条件的 为真时 验证必填

2022-08-04 16:07:11 264

原创 在vue实现dom的拖拽

vue 实现dom的拖拽交换位置以及dom内包含的数据

2022-08-04 14:38:06 772

原创 【无标题】

vue 父子组件匿名调用

2022-08-04 14:19:33 105

原创 Echarts双Y轴一侧轴不显示刻度

Echarts双Y轴一侧轴不显示刻度原因:两侧轴都未指定min和max的值,而且两侧轴数据相差过大解决:yAxis:[ { type: 'value', name: '甲烷浓度', min: 0, // 指定最小值 max: 10000, // 指定最大值 axisLabel: { formatter: '{value}ppm.m', margin: 10, colo

2021-12-05 10:32:05 5292 1

原创 2021-09-06

自记回流和重绘的区别是什么从输入url到页面展示,这一过程发生了什么promise是什么回流和重绘的区别是什么回流:当render tree的一部分或全部,因为元素的规模尺寸,布局,隐藏等改变而需要重新构建,这一过程称为回流。每个页面至少需要一次回流,就是在页面加载的时候。重绘:当render tree中的元素需要更新属性,而这些属性不会影响大小,布局,只会影响元素的外观,比如background-color,这一过程称为重绘。区别:回流必当引起重绘,而重绘不一定会引起回流。从输入url到页面

2021-09-06 15:49:12 134

原创 2021-08-13

函数执行上下文// 1、创建ao对象 AO{}// 2、找形参和变量声明 将变量和形参名 当做 ao对象的属性名 值为undefined// 3、实参形参相统一// 4、在函数体里面找函数声明 值赋予函数体function fn(a, c) { console.log(a); // function a() { } var a = 123 console.log(a); // 123 console.log(c); // function c() {} f

2021-08-13 14:15:06 128

原创 copy-webpack-plugin与webpack版本对应问题

copy-webpack-plugin注意点:– copy-webpack-plugin与webpack的版本有很大关系,[email protected]要使用[email protected]– 具体的对应关系登录copy-webpack-plugin的git的Tags的package.json查看,并且不同的版本写法也不一样,去README.md中查看写法,一定要看仔细!!!!...

2021-04-01 14:56:15 4206

原创 vue3.0 学习笔记

vue3学习笔记vue3.0六大亮点vue3.0 如何变快的?vue3.0六大亮点performance:性能比vue2.0快1.2-2倍tree shaking support:按需编译,体积比2.0更小composition API:组合API(类似React Hokks)better typescript support:更好的ts支持custom renderer API:暴露了自定义渲染APIfragment,teleport(protal)suspense:更先进的组建vue

2021-02-27 16:25:13 410 1

原创 js vue 下载excel(.xls)文件

@[TOC](js vue 下载excel(.xls)文件)1、首先,后端给到的是一个文件在服务器中的存储地址 D:\MaxSecFile\Export\Alarm_20201023111205.xls2、本下载针对chrome浏览器,使用a标签进行下载import request from '@/util/request'// 下载downloadExcel() { // 筛选数据的条件 let params = {} download(params).then(res => {

2020-10-23 13:18:14 949

原创 js/-函数

js–函数/* * 作用域 * - 在js中一共有两种作用域 * 1、全局作用域 * -- 直接编写在script标签中的JS代码,都在全局作用域 * -- 全局作用域在页面打开时创建,在页面关闭时销毁 * -- 在全局作用域中有一个全局对象window * 它代表的是一个浏览器窗口,它由浏览器创建我们可以直 * 接使用 * -- 在全局作用域中: * 创建的变量都会作为window对象的属性保存 * 创建的函数都会作为win

2020-10-20 22:42:13 331

原创 js-object学习笔记

js--object学习笔记1、js数据类型基本数据类型:number、string、boolean、null、undefined引用数据类型:object

2020-10-18 20:44:23 205

原创 vue drag实现v-for循环出来的dom元素拖拽改变位置、排序

vue实现v-for循环出来的dom元素拖拽改变位置、排序初始效果实现添加路线效果,点击√,完成添加路线5已经添加成功实现拖拽效果,更改路线3和5的位置代码如下:<template> <div class="right-wrap"> <!-- 路线展示区 --> <div class="all-item-wrap"> <div class="item-wrap" v-

2020-09-25 17:55:00 2250

原创 基于vue+ts的平行四边形进度条

基于vue+ts的平行四边形进度条// 子组件部分<template> <div style="position: relative"> <!-- 带正负 --> <div v-if="data.isCenter" style="position: relative"> // 绑定id 做唯一标识 <div class="progress-bar-wrap" :id=

2020-09-24 11:29:15 558

原创 function func() { for(var i=0; i<3; i++) { setTimeout(()=>{ consol

面试题之异步、闭包、作用域<script> function func() { for(var i=0; i<3; i++) { setTimeout(()=>{ console.log(i) }, 1000) } } var result = func()</script>// 执行结果是 打印三次 3原因:1、setTimeout是异步

2020-09-21 22:07:12 1430

原创 Vue transition 实现图片轮播效果

<template> <div class="carousel-wrap" @mouseenter="enter()" @mouseleave="leave()"> <transition-group name="list" tag="ul" @after-leave="autoPlay" class="ac_scroll-ul" >

2020-09-01 16:44:38 1173

原创 Vue+Typescript+iview实现用户权限登录

当我们点击登录按钮时,发生了什么1、login.vue 页面<template> <div class="login-wrap" :style="{backgroundImage: 'url('+ bg +')', backgroundSize: 'cover' }"> <div class="login-form-wrap"> <div class="title">登录</div>

2020-07-22 16:03:49 1519

原创 前端面试基础题

基础题1、常用的js定义类的方法,继承的方法有哪些?2、this在不同的情况下会指向不同的内容,请举例。3、Apple call bind的用途与区别4、definePropety、proxy都是做什么用的。5、什么是闭包,举个例子;6、举例 字符串 和 数组 常用哪些方法;7、可用于js的设计模式,如工厂模式、代理模式、装饰模式、观察者模式。8、reactJS的生命周期函数有哪些。9、使用webpack搭建项目。10、异步回掉 可以用什么方法写成同步代码?11、Html5有哪些新特性

2020-07-11 14:39:40 251

原创 使用canvas实现一个二叉树(vue+ts)

使用canvas实现一个说明树(vue+ts)// 子组件 tree.vue<template> <div class="binary-tree-wrap"> <canvas :id="id"></canvas> </div></template><script lang="ts"> import { Component, Vue,

2020-06-28 15:27:11 1417

原创 iview Table 实现单选

data() { return { arr: [] }}{ title: '选择', align: 'center', width: '80', render: (h, params) => { this.arr.push(params.row) return h('div', [ // iview 的 Checkbox组件 h('Checkbox', {

2020-05-15 16:30:33 1979

原创 TSLint Reassigning parameter 'd' is forbidden 警告

Reassigning parameter 'd' is forbidden将tslint.json的 ‘no-parameter-reassignment’,改成false"no-parameter-reassignment": falseTSLint校验规则:https://palantir.github.io/tslint/rules/

2020-05-14 10:46:55 671

原创 forEach循环 当满足条件时跳出当前循环

forEach循环 当满足条件时跳出该循环使用try catchtry { this.menuData.forEach((item: any) => { if ((toPath as string).indexOf(item.url) === 0) { this.currentUrl = item.url throw new Error ('EndIterative')...

2020-04-30 13:18:11 4429

原创 Vue+ts 自定义select组件,返回选中的元素

Vue+ts 自定义select组件,返回选中的元素自定义子组件selecTemp父组件使用select自定义子组件selecTemp// SelectTemp.Data 参数类型export interface SelectData { selectOption: any[], // 下拉框选项 type: string, // select类型,主要用来区分不同样式 ...

2020-04-17 13:30:04 1888

原创 高德地图的infowindow使用click方法

使用vue.extend()createInfoWindow() { var _this = this var MyComponent = Vue.extend({ template: '<div style="width: 500px">' + '<div class="title">温室</div&g...

2020-04-15 14:39:40 2068

原创 iview的Table中引用自定义组件

// 引入组件import { Component, Vue } from 'vue-property-decorator'import ProgressByColor from '@/components/cm/progress.vue'@Component({ components: { ProgressByColor }})export default class Ab...

2020-04-15 14:26:28 657

原创 滚动条样式

效果图<div class="info-wrap"></div>/** style css */.info-wrap { height: 100px; overflow-y: auto;}.info-wrap::-webkit-scrollbar{ width: 4px; height: 4px; overflow-x: hidd...

2020-04-15 14:15:38 142

原创 给li动态添加border,兄弟元素会抖动的解决方案

li { border: 2px solid transparent; // 先写上border进行占位,这样就可以防抖动。transparent为透明色}// 动态添加border.active-li { border-top: 2px solid; border-right: 2px solid #067fe2; border-bottom: 2px solid; ...

2019-12-04 10:11:52 1065

原创 杂食向--看看看看看着你

看看看看看着你技术类配色及摄影类学习类网站技术类1、vue_cli3+vue+typescript–主要学习构建思路,包括node脚本初级写法https://www.jianshu.com/p/44500385abdd配色及摄影类1、摩洛哥:旅行、摄影、城市配色https://www.zcool.com.cn/work/ZNDAzNDg1MTI=.html2、纽约:曼哈顿,HUAWE...

2019-11-07 17:20:40 153

原创 [warning] non-arrow functions are forbidden

[warning] non-arrow functions are forbidden// 警告non-arrow functions are forbidden// 警告代码片段getTunnelInfo: function () { ...}// 修改getTunnelInfo () { ....} // 编译通过...

2019-10-17 17:31:10 2595

空空如也

空空如也

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

TA关注的人

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