- 博客(33)
- 收藏
- 关注
原创 vue中使用bpmn-js绘制流程图,并实现汉化、自定义Palette及ContextPad。
vue中使用bpmnjs绘制流程图,实现汉化、自定义palette、contextpad及右侧properties-panel
2023-03-15 14:18:24
6338
3
原创 vue3中echarts Uncaught Error: `resize` should not be called during main process.
通过chart = echarts.init(document.getElementById(‘categoryId’)) 获取的echarts实例,chart 无法正确获取原因:Vue3使用了proxy,Echarts无法从中获取内部变量解决方法:不要在data中定义chart,将chart定义为全局变量,或者使用shallowRef...
2022-06-30 10:24:34
1221
1
原创 vue 2.X注意点总结
1.vue生命周期创建->挂载->更新->销毁 1. beforeCreate 2. created3. beforeMount4. mounted5. beforeUpdate6. updated7. beforeDestroy8. destroyed2.在哪个阶段有$ el(组件根节点),在哪个阶段有$data(data中的数据)beforeCreate 都没有created 有data,无elbeforeMount 有data,无elmounted 都有
2022-02-16 16:46:46
297
原创 vue项目如何配置开发、测试、生产,环境变量
1.在项目根目录下新建.env文件,文件内部如下:VUE_APP_MY_NAME = '嘻嘻哈哈'可在main.js中 打印 console.log(process.env.VUE_APP_MY_NAME, 'env') 即可获取到添加的VUE_APP_MY_NAME 变量** 注意 ** .env 文件会在所有的环境中被载入配置开发环境环境变量1.新建.env.development文件NODE_ENV = 'development' //模式NODE_BASE_URL = '
2022-02-16 11:27:17
1233
原创 前端页面自适应(js/vue)
需要设计图为1920*1080,其他尺寸需要重新计算1.新建flexible.js(function flexible (window, document) { const docEl = document.documentElement const dpr = window.devicePixelRatio || 1 // adjust body font size function setBodyFontSize () { if (document.body) {
2022-02-14 15:30:52
623
原创 js防抖和节流
防抖(只执行最后一次)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <
2022-02-09 16:39:37
472
原创 css-双飞翼布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do
2021-12-26 21:47:19
72
原创 css-圣杯布局
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入<!DOCTYPE html><html lang="en"><head>
2021-12-26 20:04:30
104
原创 根据id递归出对应父级id及当前id
根据id递归出对应父级id及当前id function recursionfind (id, arr, path) { if (path === undefined) { path = [] } for (let i = 0; i < arr.length; i++) { const tmpPath = path.concat() tmpPath.push(arr[i].deptId) if (id
2021-11-01 15:16:56
346
原创 el-tree增加指示线(同级增加连接)
el-tree增加指示线后效果项目中使用less(样式嵌套、并定义一些变量),将class = ‘tree_container’ 放在包裹el-tree容器上即可,可以写一个公共样式文件引入,然后就可全局使用。// el-tree指示线样式.tree_container { .el-tree>.el-tree-node:after { border-top: none; } .el-tree-node { position: relati
2021-10-07 16:23:10
1895
1
原创 el-tabel 树状表格前端实现模糊搜索功能
<template> <div class="m-page"> <el-form class="m-card" :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="height:62px"> <el-form-i
2021-10-07 16:13:15
1615
原创 学习虚拟DOM和diff算法笔记
虚拟DOM和diff算法什么是虚拟DOM虚拟DOM相当于是对真实DOM的抽象,本质是一个javascript对象,这个对象就是更加轻量级的对DOM的描述。什么是diff算法diff算法可以让DOM以最小的代价实现更新。List item...
2021-06-04 08:28:02
99
原创 uniapp获取完整用户信息、手机号的加密数据encryptedData以及加密算法的初始向量iv
1.手机的加密数据encryptedData和加密算法的初始向量iv<button open-type=“getPhoneNumber” @getphonenumber=“getPhoneNumber” withCredentials=“true”>获取手机号码getPhoneNumber(e) {if (e.detail.errMsg == “getPhoneNumber:ok”) {console.log(e.detail.encryptedData,‘手机号的加密数据’);con
2020-09-18 14:33:08
3204
原创 uniapp+colorui 遮罩穿透问题
当换出遮罩时,上下滑动依然可以滑动遮罩底部内容此时给遮罩的view标签增加catchtouchmove=“return”,就可以防止穿透遮罩问题。
2020-09-18 14:02:54
720
原创 学习TypeScript笔记整理
1.JavaScript是什么?是一种运行在客户端中的编程语言。(为网站提供动态交互特性,让网页“动”起来)2.TyptScript是什么?简称TS,是JavaScript的超集(JS有的TS都有),为JS添加了类型系统、接口、枚举等一些高级功能。由微软开发的编程语言,设计目标是开发大型应用。3.TS与JS比较优势:1.类型化思维方式,使开发变得更加严谨,提前发现错误,减少该bug时间。2.类型系统提高了代码可读性,并使维护和重构代更加容易。3.补充了接口、枚举等开发大型应用时JS缺失的功
2020-09-09 08:57:19
250
原创 JavaScript实现深、浅拷贝以及区别
1.浅拷贝只是拷贝一层,更深层次对象级别的拷贝只是拷贝了地址(也就是拷贝引用)对于复杂数据类型来说,比如上面这个obj对象中再次嵌套一个对象,这个对象会在内存中重新开辟一块内存空间,并且指向他;而利用上面这种方式进行拷贝时,新拷贝出来的数据内部对象依然指向之前的内存,如果说修改拷贝出来的这个对象的内部对象的值,之前的值也会被改变。2.深拷贝是拷贝多层,每一级别的数据都会拷贝。深拷贝Obj中的对象或者数组,会在内存中也会开辟出新的内存空间,所后面修改Obj中的对象或者数组都不会影响之前的数据。.
2020-09-07 17:28:09
91
原创 数组翻转、冒泡排序、数组去重
一、翻转数组(图中为两种处理方法)注意:翻转数组的核心是跟索引号有关系的,将老数组(arr)最后一个元素给新数组(newArr)的第一个,将arr的倒数第二个元素给newArr第二个,以此类推;二、冒泡排序一种算法,把一系列的数据按照一定的顺序进行排列出来(从大到小或者从小到大)注意:冒泡排序的核心就是依次比较两个元素,如果他们顺序错误就把他们交换过来三、数组去重注意:核心主要是遍历旧数组,然后拿着旧数组元素去查询新数组,如果该元素在新数组中存不存在,不存在就将这个元素添加到新数组中,否则
2020-09-02 10:47:14
212
原创 webpack3.0使用
什么是webpack?webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。webpack可以做什么事情???1.webpack可以处理js文件的相互依赖关系。2.webpack能够处理js的兼容问题,把高级的、浏览器不识别的语法,转为低级的,浏览器能够有正常识别的
2020-09-01 15:04:14
262
原创 WebSocket简介与使用
一、什么是websocket?WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。二、为什么会出现websocket?传统的http协议只能通过客户端向服务端发请求的方式来获取服务端最新数据(单向的),也就是我们常说的轮询(每隔一段时候,就发出一个询问,了解服务器有没有新的信息),这样的效率非常的低,而且非常浪费资源。这个时候就出现了WebSocket,他使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket A
2020-08-31 10:34:07
278
原创 前端面试ES6、7、8
一、var、let、const三者的区别在es6之前变量声明都是用的var关键字,因为js中预解析(浏览器首先会默认的把所有带var和function声明的变量进行提前的声明或者定义)存在。1.var1)存在变量提升。2)没有块级作用域。2.let(定义变量)1)不存在变量提升。2)有块级作用域。3)不允许在同一作用域内重复声明同一个变量。4)暂时性死区:在代码块内,使用let声明变量之前,该变量都是不可以使用。5)先声明后使用。3.const(定义常量)1)先声明后使用。2)有块
2020-08-28 11:56:14
495
原创 前端面试基础(想到会更新的、)
Html5 新增那些标签?布局标签:header,section,footer,article,aside表单标签:datalist,input:type=“ week| datae |time | datetime | number | search | url | tel | color | email | range ”多媒体标签:audio,video其他标签:progress(进度条),meter行内元素的 padding 和 margin 可设置吗?行内元素设置水平方向的padd.
2020-08-27 11:59:18
141
4
原创 如何搭建一个vue项目(脚手架,可视化面板搭建)
如何搭建一个vue项目(脚手架,可视化面板搭建)一.安装node1.去node.js官网 https://nodejs.org/en/download/ 根据电脑系统选择下载node。2.打开命令行输入node -v及npm -v检查node和npm的版本(没有输出说明安装失败)。3.为了提高我们的效率,可以使用淘宝的镜像 npm install -g cnpm –registry=https://registry.npm.taobao.org,同样可 以输入cnpm -v查看版本及是否安装成
2020-08-26 10:18:10
1705
原创 VUE利用自定义指定防止按钮重复点击
第一步:新建plugins.jsimport Vue from ‘vue’// 自定义指令防止按钮重复点击 v-preventReClick(使用时)const preventReClick = Vue.directive(‘preventReClick’, {inserted: function(el, binding) {el.addEventListener(‘click’, () => {if (!el.disabled) {el.disabled = truesetTimeo
2020-08-18 16:44:19
746
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人