- 博客(60)
- 资源 (19)
- 收藏
- 关注
RSS订阅原创 实现elementui-tree组件鼠标滑过显示标签信息
项目中产品提了一个这样的需求（鼠标悬浮标签之上展示标签信息），老大一直问能不能实现？他不确定的点是在他写的位置不对，还有取的定位值不对，因为如果是说单纯从树节点自定义滑入滑出显示定位标签的话当列表内容过多出现滚动条的时候会导致标签内容被遮住！那这个时候我们就可以考虑除了子元素相对定位之外还有什么方法可以获取到当前位置进行内容跟随显示，那就是我们的鼠标位置信息。可以通过获取鼠标位置信息，设置标签信息模块在外层，通过获取鼠标距离X轴Y轴的位置进行固定定位！
2023-05-30 17:54:43
1618
原创 基于element的地址三级联动
基于element的级联选择器的地址三级联动，真的简单粗暴，直接附上代码地址json文件，请点击这里实现代码，重点还是在json文件的数据结构，处理好基本上就ok<template> <div class="block"> <span class="demonstration">默认 click 触发子菜单</span> <el-cascader v-model="value" :options="optio
2023-02-22 14:52:34
356
原创 ES6新特性
const与let变量使用var带来的麻烦运行getClothing后输出的是undefined，这是因为执行function函数之前，所有变量都会被提升，提升到函数作用域顶部let与const声明的变量解决了这种问题,因为他们是块级作用域, 在代码块(用{}表示)中使用let或const声明变量, 该变量会陷入暂时性死区直到该变量的声明被处理.运行getClothing(false)后输出的是ReferenceError: freezing is not defined,因为 freezing
2022-06-16 15:57:48
219
原创 uniapp开发注意事项（二）
一个文档中的注意事项，往往是发生问题的原因，这里整合了我认为容易发生的错误（为了方便我搜索问题）1.static 目录下的 js 文件不会被编译，如果里面有 es6 的代码，不经过转换直接运行，在手机设备上会报错。2.css、less/scss 等资源同样不要放在 static 目录下，建议这些公用的资源放在 common 目录下。3.template内引入静态资源，如image、video等标签的src属性时，可以使用相对路径或者绝对路径。4.js文件不支持使用/开头的方式引入。5.css文件或style
2022-06-16 15:32:28
3361
转载 写好javascript条件的5条守则
原文地址：5 Tips to Write Better Conditionals in JavaScript译文出自：阿里云翻译小组译文链接：https://github.com/dawn-teams/translate/blob/master/articles/5-Tips-to-Write-Better-Conditionals-in-JavaScript.md译者：眠云(杨涛)校对者：也树，Mcskiller在用 JavaScript 工作时，我们经常和条件语句打交道，这里有5条让
2020-09-30 17:34:03
128
原创 vue引入本地字体
首先把字体下载到本地然后在css文件里新建css文件，为字体重命名最后在main.js引入即可全局使用页面中使用，例如<template> <div class="expant"></div></template><style>.expant{ font-size:rr}</style>...
2020-09-30 17:16:55
1440
3
原创 vue+element动态生成可折叠表格
最近看到很多人问怎么样做多层可折叠表格，其实vue+element是很简单实现的，就是数据结构的问题，使用element table组件的树形数据与懒加载，实现代码如下(主要是数据的处理，跟后端同事协调好返回的数据结构，或者前端做数据处理都是可以的)<template><div> <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key=.
2020-09-30 17:07:19
2664
1
原创 对 el-table 进行二次封装
<template> <div class="swdTable"> <div class="table"> <el-table ref="multipleTable" :data="tableData1" tooltip-effect="dark" style="width: 100%" :header-cell-style="{ 'back.
2020-09-14 09:35:53
1379
原创 再来一篇，在js中引入vditor的用法
简单粗暴，上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <!-- ⚠️生产环境请指定版本号，如 https://cdn.jsdelivr.net/npm/vditor@x.x.x/dist... --> <link rel="stylesheet" hre
2020-09-11 17:14:30
1243
6
原创 Vue中引入vditor插件的正确用法
很多人看vditor的官网可能第一时间就想到在main.js里面引入，但是官网的例子又是一个实例化的过程，我们的spa不支持多个实例化，所以其实他的核心是new的过程是个实例化的过程，需要要真实的dom给他承载。向echars这些我们平时的引入使用是一样的附上代码，可直接拿到项目里面运行（必须引入插件vditor，npm install vditor --save）<template> <div class="order"> <h5>富文
2020-09-11 16:03:08
3565
1
转载 面试必问——react与vue的区别
原文地址：https://juejin.im/post/5ef55acde51d4534bf67a878 1.Vue和React源码区别1.1 Vue源码 1.1.1 挂载初始化$mounted会挂载组件,不存在 render 函数时需要编译(compile);...
2020-09-11 10:43:28
1358
原创 uniapp-语音识别
首先先配置好权限注意：不能同时支持讯飞语音识别和百度语音识别，只可二选一百度语音识别在manifest.json文件“App模块配置”项的“Speech(语音输入，只能选一个)”下，勾选“百度语音识别”项，并输入从百度开放平台申请的参数：appid： 百度语音开放平台申请的AppID apikey： 百度语音开放平台申请的API Key secretkey： 百度语音开放平台申请的Secret Key请到百度语音开放平台申请：https://console.bce..
2020-09-08 15:05:33
7542
6
原创 vue组件通信的几种方法
vue中我们最常使用的就是父子之间的通信还有全局数据管理vuex了，下面粗略说一下vue组件通信的几种方法组件通信的几种方式1、父子组件通信2、兄弟组件通信3、跨多层级组件通信4、任意组件（vuex）一、父子组件1、父组件通过props传递数据给子组件，子组件通过$emit发送事件传递数据给父组件（单向数据流）2、还可以通过v-model语法糖（双向数据绑定）3、$parent,$children对象来访问组件实例中的方法和数据4、$listeners,$sync（2
2020-08-12 15:47:18
635
原创 uniapp热更新（wgt）
uniapp分两种更新机制：一、整包更新(这种方式比较繁琐，即每次更新之后就要打云包，更新整包，用户体验也不好)二、资源包更新，即wgt（因第一种方法想到利用资源更新，用户体验大大提升，用户更新之后无需跳转到应用市场或者浏览器去重新更包，俗一点就是无感更新）wgt热更新的注意点一、必须要获取appid二、配置需要的版本名称和版本号三、判断平台，区分安卓ios获取相对应的下载连接（第一次整包需要，之后全部是wgt资源包的下载地址）四、在本地打包时和热更新时，App版本和wgt.
2020-08-12 11:06:52
23818
5
原创 动画效果-飞翔的小鸟
<DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <style> .bird{position:absolute;left:0;width:200px} </style> <script> /* 匀速运动 * 速度保持不变的运动 飞翔小鸟： * 不断改变l.
2020-07-22 14:30:43
354
原创 四.css sprites 的原理
1.将多张背景图片等有规则的合并成一张背景图，即多张图片合为一张整图，然后用background-position来实现背景图片定位技术①，通过图片整合来减少对服务器的请求次数，从而减少页面的加载速度②，通过整合图片来减少图片的体积2.滑动门技术...
2020-07-22 14:12:21
138
原创 三.overflow 内容溢出容器时的处理方式
三.overflow 内容溢出容器时的处理方式visible可见的 hidden隐藏 scroll出现滚动条 auto内容溢出才出现滚动条设置某个方向：overflow-x 水平方向 overflow-y垂直方向当某一个方向的值不为visible，另一个方向的值会自动设置为auto备注:隐藏元素的两种方式1.display：none；隐藏元素，不占位置2.visibility：hidden；隐藏元素，占位置overflow的应用场景：1.高度塌陷，子元素都浮动了，父元素会没有
2020-07-22 14:12:05
828
原创 二. 定位 position
二. 定位 position1.static 静态定位，默认定位不能配合left right bottom top使用。2.相对定位relative特点：①.相对于自己本身所在的位置进行移动定位②.配合left，right，top ，bottom使用，相对于自己的某条边往元素中心方向移动为正值③相对定位的元素不脱离标准流（灵魂定位）3.absolute绝对定位特点:①绝对定位的元素相对于html或者最近的有定位（除了static）的父元素进行定位②通过left，right，t
2020-07-22 14:11:29
168
原创 元素类型及转换
一.元素类型1.块级元素：div、h1-h6、p、列表、form特点：①占父元素宽度的一整行，若是设置死宽度，那多余的位置会用margin填充。②可以设置宽高③块级元素可以包含部分块级元素及所有的行内元素应用：若想子元素（块级元素）在父元素水平居中，对子元素设置margin：0 auto。2.行内元素：span/a/加粗/倾斜/input/select/textarea/label特点：①宽高由内容决定，不能设置宽高②一行显示多个③行内元素遵循盒模型，不能设置上下的pad
2020-07-22 14:10:48
992
原创 移动端布局
一.页面结构布局1.百分比布局。2.弹性盒布局。3.分栏布局。4.响应式布局。移动端布局为多种布局结合使用，达到完美适配效果二.单位1.px2.百分比3.em 相对单位，基于自身字体大小font-size来计算，所以不同的元素1em代表的具体大小可能不同（部分浏览器的默认字体大小为16px）4.vw viewport width,视窗宽度，1vw等于视窗宽度的1%5.vh viewport height,视窗高度，1vh等于视窗高度的1%注意：使用vw/vh,需设置met
2020-07-22 14:09:52
189
原创 ＜HREF＞元素/标签
值描述URL超链接的 URL。可能的值：·绝对 URL - 指向另一个站点（比如 href="http://www.example.com/index.htm"）·相对 URL - 指向站点内的某个文件（href="index.htm"）·锚 URL - 指向页面中的锚（href="#top"）在页面中点击a标签后
2020-07-22 14:07:20
517
原创 接上一篇图片转base64-＞图片上传
//图片处理的js文件export function uploadImgToBase64(file) { return new Promise((resolve, reject) => { const reader = new FileReader() reader.readAsDataURL(file) reader.onload = function () { // 图片转base64完成后返回reader对象 r.
2020-07-22 13:55:46
208
原创 图片转Base64
export function uploadImgToBase64(file) { return new Promise((resolve, reject) => { const reader = new FileReader() reader.readAsDataURL(file) reader.onload = function () { // 图片转base64完成后返回reader对象 resolve(reade.
2020-07-22 13:51:37
219
原创 自适应布局与响应式布局
自适应布局不同大小设备呈现同样的页面效果，只是文字、图片等的大小不一样，但是相对位置一样。例如：百分比布局、弹性盒布局flex、分栏布局。百分比布局所有的宽高都用百分比来实现Css3分栏布局css3多列布局可以自动将内容按指定的列数排列，这种特性实现的效果和报纸、杂志类排版非常相似。分栏布局属性columns：列宽 列数column-width 栏目最小宽度column-count 栏目最大列数column-gap 栏目间距，不能为负column-rule 栏
2020-06-19 16:11:26
521
原创 三大循环语句
一.while循环1.格式：while（条件）{条件成立执行这样的代码这里的代码执行完毕，继续判断条件是否成立避免死循环：让条件不成立变量更新：往条件不成立的方向改变}2.循环语句的组成部分：*变量初始化*条件判断*变量更新3.重点：循环语句的整个执行过程二.do _ while循环1.格式：do{先执行一次这里的代码（不管条件是否成立）再进行条件判断，如果成立再执行这里的代码}while（条件）三.for循环1.格式：for（变量初始化;
2020-06-18 16:39:07
841
原创 说一说浏览器兼容
一、浏览器兼容Internet Explorer (IE)Safari (ios) ( Safari)Mozilla Firfox (Firefox 火狐)Google Chrome （Google）Opera (Opera)最早：Netscape Navigator网景全页航者（1994-2008 “NN”）二、五大浏览器内核代表作品Trident:IE Maxthan, 腾讯，360，Theworld世界之窗；IE (MSHTML) 捆绑在windows中，只应用
2020-06-18 13:39:03
164
原创 node图片验证码
新建modules文件夹，在文件夹下新建captcha.js下载相关插件npm i svg-captchavar svgCaptcha = require("svg-captcha");exports.getCode = (req,res)=>{ var codeConfing = { size:4, ignoreChars:'0o1il', noise:2, height:44 } va
2020-06-17 15:57:25
496
原创 node+mysql+express图片上传
最近闲来无聊，自己用node写了个后台管理系统，对于图片上传的问题我这边进行分享一下，有不对的地方，请指正关于一些准备工作我就不做详细说明了，安装环境我相信大家都会，下面我们进入正题我这里使用的是multer实现文件的上传，首先下载multer模块然后在项目里引入我们做文件上传，肯定是要先设置文件保存的路径这里可以看到，图片上传成功后会保存在public下的images文件夹下，我对文件进行了改名，所以文件保存到指定路径的时候会加上当前时间戳multer分单文件上传和多文
2020-06-17 14:10:20
1567
1
原创 基于element-ui的input二次封装，实现表单单个认证
由于项目有很多表单，很多都是一个，所以想起了封装input组件好了实现思路：因为本身表单就有验证，所以结合了表单的部分认证去实现，可以自己进行自定义模板操作代码如下：大家视情况，有些是不用点击事件触发的，按钮可以视情况而定props主要接收两个参数：input框类型，还有一个是验证的类型，因为我这里有textarea验证，限制长度，验证内容自定义，根据实际需求通过watch监听type的变化改变ruleForm下面的变量这个要注意，trigger如果是相对于多
2020-06-16 18:05:34
2311
原创 uniapp请求封装
在main.js直接引入import http from './static/js/http.js'Vue.prototype.$http=http;组件中使用
2020-06-16 10:58:35
236
原创 uniapp开发注意事项
第一次用uniapp开发真的????了很多坑，每个项目都是在踩坑中不断的走过，不断得查资料解决中度过的，现对自己踩过的坑做一个总结，因为只涉及到app端，所以总结的可能不是都适用1、在pages.json里的titleNView或页面里写的plus api中涉及的单位只支持px，不支持rpx2、tenplate内引入静态资源，比如图片，视频的src属性时，可以使用相对路径或者绝对路径3、静态文件目录下打js文件不会被编译，如果里面有es6的代码，不经过编译转换直接运行的话，在手机上是会报错的
2020-06-16 10:46:41
1109
原创 github操作守则
之前写过一篇关于GitHub的配置，但是不够详细，今天来详细写一下github的整个流程操作步骤如下：一.下载git，安装地址：https://git-for-windows.github.io二.配置个人信息（名字与邮箱）1.单击鼠标右键，出现Git Bash Here2.配置个人信息*git config --global user.name "Your Name"...
2020-04-21 15:00:12
296
原创 对双向数据绑定的理解
应该很多人面试都会被问到这个问题，现在趋势面试已经趋向于底层原理的刨底了，因为vue谁都会，你用vue做了一个项目，真的不能代表你对vue就很熟悉了，随着vue3.0的出现，双向数据绑定使用ES6的Proxy 作为其观察者机制，取代之前使用的Object.defineProperty。这篇文章我们先来说说怎么利用Object.defineProperty()去实现双向数据绑定的？首先vue通过...
2020-04-17 13:29:01
549
原创 H5新特性有哪些？怎么理解语义化
H5新增了很多新的特性，这也成了我们面试的时候面试官喜欢问的一个问题，那我们可能在开发的过程中如果没有去关注过那也不是很清楚用到的是不是H5的新特性，下面我们就来讲一下H5十大新特性1、语义化标签，为我们提供了更好的页面结构，比如<header><section><nav><aside>,这些标签可以让我们更直观的知道你要表达的是什么，再更进...
2020-04-07 21:17:05
857
通用权限管理系统前端页面+html5+css3+javascript+vue+elementui
2023-05-30
通用权限管理系统+springboot+mybatis plus+spring security+jwt+redis+mysql
2023-05-30
css3-3d旋转-色子
2020-09-30
全国地址三级联动json
2020-09-11
web开发工具
2017-08-04
奥多比集成运行时
2017-08-03
模拟数组中的内容交换（swap）
2017-07-29
增加一个文本输入框，用户输入单元格的序号，点击按钮，该单元格背景变颜色
2017-07-29
模拟数组的顺序遍历
2017-07-29
把数据结构中的数组视觉化
2017-07-29
单元格的背景颜色根据点击按钮发生变化
2017-07-29
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人