sha虫剂-CSDN博客

原创 el-tabs切换按钮定位不准确，部分内容被遮挡（前端vue实战踩坑记录）

el-tabs切换按钮定位不准确，部分内容被遮挡（前端vue实战踩坑记录）

2022-11-15 15:06:18 1985 2

原创遇到某些无法在浏览器中查看元素的bug应该如何排查（实例）

以element UI 树组件定位线偏离问题解决及思路讲解，借助实例阐述在无法进行"F12"时该如何检查代码问题

2022-10-11 10:35:06 1139

原创 git的使用从基础到进阶

git基础篇版本控制系统本地工作区 add 暂存区 commit（每一次commit都会产生一个新的版本）本地仓库 push 远程仓库git代码托管平台https://github.com/https://dev.tencent.com/https://gitee.comgit使用步骤1、第一次使用git的时候需要执行1-4步，否则直接跳到第五步。执行 git config --global user.name [用户名，个人空间地址]如 git config

2022-04-18 12:02:59 427

原创前端踩坑记录，有关antv G6和vite兼容性问题

vite+G6打包报错，开发环境无问题，打包后相关页面打不开

2022-02-22 13:45:41 2749

原创让你的页面更加清爽（vue实战，表格的优化，数据配置表格）

在各种后台管理系统中，我们经常会有很多页面的table表格用来进行数据的搜索和展示。然而很多时候都是重复的操作，我们经常是各种复制粘贴，导致代码逻辑看着虽然挺清晰的，但重复代码很多，而且html结构过于臃肿，很多时候都找不到自己想要的东西。一、过去的写法<el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="Date" width="180" /> &

2021-11-24 18:07:37 2110 2

原创日常开发中的git使用

git版本控制系统本地工作区 add 暂存区 commit（每一次commit都会产生一个新的版本）本地仓库 push 远程仓库git代码托管平台https://github.com/https://dev.tencent.com/https://gitee.comgit使用步骤1、第一次使用git的时候需要执行1-4步，否则直接跳到第五步。执行 git config --global user.name [用户名，个人空间地址]2、执行 git config

2021-09-01 13:45:14 229

原创前端开发js编码规范问题

在页面开发中，基本每个人都有自己的开发习惯，这就导致在多人开发时，我们很多时候会因为不习惯他人的开发习惯，导致代码的阅读很难，拖慢开发进度，或者是直接无法进行维护。所以，一个良好的编码习惯是我们应该养成的，这会使得我们自己的开发速度变快的同时增加代码的可阅读性。这里我搬运来了github上面的一篇文章，希望能对大家有帮助。无疑，这对我自己也有很大的帮助原文gihub地址Airbnb JavaScript 风格指南() {使用 JavaScript 最合理的方式。注意: 这个指南假定你正在使用 B

2021-04-27 15:42:51 345

原创 js基础笔记（个人用）

JS基础console.log 控制台输出prompt 弹出一个输入框alert 警告弹框一、概念1、JavaScript是一门面向对象的，跨平台的脚本语言对象：属性和方法跨平台：可以在多平台使用脚本：凡是不能独立执行需要依赖其他程序的，通常都叫做脚本，也叫动态语言。（宿主语言）2、JS历史1995 它最初由Netscape（网景公司）的[Brendan Eich](https://baike.baidu.com/item/Brendan Eich)设计为Netscape

2021-03-31 17:21:44 145

原创弹性盒布局（flexbox）个人笔记

弹性盒布局（flexbox）一、弹性盒布局介绍1)弹性盒也叫伸缩布局盒模型它是**css3引入的一种新的布局模式——flexbox**布局，即伸缩布局盒模型，用来提供一个更有效的方式制定、调整和分布一个容器里的项目布局。相比之前的布局方式，更便利于开发。2)主要思想是让容器有能力让其子项目能够改变其宽度、高度（甚至顺序），以最佳的方式填充可用空间（主要是为了适应所有类型的显示设备和屏幕大小）。flex容器会使子项目扩展来填充可用空间，或缩小他们以防止溢出容器。3)专业术语解释a、主轴-水平方向

2021-03-31 17:15:21 1088

原创数组，字符串，以及一些BOM操作总结（自用总结，不喜勿喷）

数组，字符串，以及一些BOM操作总结基本数据类型：number、string、Boolean、undefined、null引用数据类型：object（array也属于object）、function数组的常见APIpop（）删除并返回数组的最后一个元素修改原数组push（）向数组的末尾添加一个或者更多的元素，并返回新的长度修改原数组shift（）删除并返回数组的第一个元素修改原数组unshift（）

2021-03-31 17:13:02 232

原创踩坑记录，移动端开发使用height=100vh

记录一次踩坑经验，因为项目需求，在重置样式的时候没有给body设置height：100%，而是设置了min-height:100%,导致在开发中给页面设置高度的时候设置height:100%;是没有任何效果的，所以使用了height:100vh,因为1vh单位代表了屏幕可视区域的1%，在开发中浏览器预览并没有任何问题。然而，实际发了测试包，在苹果手机上测试的时候出现了问题，本来应该定位在屏幕底部的一个元素距离实际屏幕底部有了一定的距离，并且出现了滚动条为什么就是因为在高度上各手机的浏览器存在一定的差异

2021-03-18 18:11:04 2983 9

原创实战iframe嵌套页面如何进行参数传递

在开发中，偶尔会遇到需要在一个页面之中嵌套调用不同域名的项目进行展示，这时候就有一个问题，调用另外的项目的时候会需要一些参数，或者说是某些验证规则，但是我们的url传参又是有限制的，很多时候并不能完整的传过去我们需要的所有数据，所以在这里讲一下如何进行iframe父页面对子页面的参数传递（通信）父页面代码1、html部分<iframe src="https://xxx.xxx.xx" ref="Frame" scrolling="auto"></iframe>2、方法

2021-03-11 15:15:42 10302

原创实战向如何在vue中使用富文本编辑器（复制即可用）vue-quill-editor

实战向如何在vue中使用富文本编辑器富文本编辑器，其实网上已经有很多很多的攻略了，这也是一个经常会使用的东西，但是总有些人会觉得别人写的自己看不懂，所以今天我整点能复制过去直接就能用的一、依赖插件vue-quill-editor这是核心插件直接安装之后引入就是了，基础好的建议直接去官网看api，比我这里更能找到自己想要的东西二、上代码1、引用插件import "quill/dist/quill.core.css";import "quill/dist/quill.snow.css";im

2020-12-09 11:31:22 1203 2

原创 WEB页面或者H5页面如何打开高德或者百度地图APP导航（实战向）

一、序言在日常开发中，地图的接入使用在各大app和网站中我们都不难见到，打开方式也各有不同，嵌套内部的，或者是直接打开百度，高德，谷歌等地图app。相对来说，各大地图app的文档写的非常齐全，即使是按照官网示例复制进去也能起到该有的效果，需要用什么功能搜什么功能就是了。唯独打开地图app可能很多小伙伴总是搜不到，所以，本文介绍一下，如何在网页或者H5内调用百度和高德（用这俩的最多，就直接说这俩了）二、如何在页面内调用地图其实很简单，基本上来说，看一眼就会了，其实就仅仅只是一个url链接，跳转过去就是了

2020-11-09 10:08:21 10444 17

原创新手向axios的二次封装，以及接口统一管理（基于vue）

关于接口请求的封装，网上真的很多，可以说各种的都有，这里，我分享一下自己的请求封装（基于vue）一、创建js文件在公用的工具文件夹下创建request.js文件（名字不重要）二、封装请求import axios from 'axios' //引入axiosimport store from '@/store/index' //引入vuex（只是一种储存手段，可以不用）// 创建axios实例const service = axios.create({ timeout: 30000

2020-09-21 17:14:53 592 2

原创 vue实战，前端如何调用手机录音功能

最近在开发中，需求中有实时聊天功能实现，但是在在之前项目中集成的，所以并不能选择类似uniapp等已经封装好的框架，经过多方查询，最后总算实现了这个功能。一、实现原理在web API中提供了getUserMedia这个方法，就是用来给我们获取各种媒体应用的，想了解底层的可以百度一下这个方法，介绍的很详细，了解这个东西，自己也能手动封装插件，但是既然是实战，咱们要的就是用最快的方法实现我们需要的功能，所以，下面我们就介绍一个插件二、录音插件js-audio-recorder官方地址：gitHub官方地

2020-08-18 11:14:11 6480 28

原创实战踩坑笔记！微信支付回调页面跳转错误问题，巨坑！！！！

vue实战踩坑笔记！微信支付回调页面跳转错误问题，巨坑！！！！最近在开发新的H5页面时，要求将老项目也一起集成到新项目中，方便进行统一管理，优化代码。在这之中，涉及到了微信支付问题，本以为已经写好的跳转方法拿过来也就OK了，没想到踩了一个巨坑，找了小半天才找到问题的症结所在一、问题描述在以前老项目中，vue是用引入的vue文件方式写的，支付回调能够正常跳转在新项目中，优化了引入式vue改为vue cli3进行书写，但是同样的跳转方式，微信回跳的页面总会错误，而支付宝的就没有问题，这要怎么解决啊

2020-07-22 13:09:50 2677

原创 vue结合esmap进行室内3D地图绘制

vue cli3结合esmap进行室内3D地图开发近日，项目需求中有需要进行室内3D地图的开发，虽然可以和百度高德地图合作，让百度高德制作3D地图，但是成本太高，在进行多方查找之后，找到了esmap这个绘制地图的框架，下面具体介绍怎么做先整个官方文档地址ESmap文档地址一、下载官方的sdk包除了sdk也可以先下一个官方示例包，相信看着示例更容易理解，虽然不是所有的都有用，先下下来总是没错的，写完把没用的删除了就是二、注册账号，绘制地图账号注册就不啰嗦了注册之后，在控制台点击编辑地图

2020-07-17 11:00:02 4734

原创如何在vue项目中监测数据变化来实现自动打印

怎样在vue项目中监测数据变化来实现自动打印一、初代版本初代版本中，并没有要求自动打印，要实现的是手动打印，这个功能没啥可说的，直接用vue-print-nb这个插件就OK，实现方式也很简单，我这里简单说一下，网上很多类似教程1、安装npm install vue-print-nb --save2、引入全局如下在main.js中引入，非全局不用说了把，引入直接用就行import Print from ‘vue-print-nb’Vue.use(Print);3、查找id方式打印<

2020-06-30 16:28:33 4312 15

原创在vue开发中遇到的一个小bug，el-select数据视图不统一。

一、项目需求在一个项目需求中，我们很多时候需要进行地区的三级联动选择，这个相信很多人都不陌生，也就不过多介绍了，但是在有的时候，我们需要进行等级选择1、等级选省级择只能选择省级菜单，市级和县级隐藏，2、选择市级，那么只隐藏县级菜单，3、选择县级都不隐藏如：二、可能产生的bug在选择的时候，我们有可能选择县级，区域全部选择完成，但突然又改为市级，那么这个时候就要重置数据，如不重置，上传时会把已经隐藏的县级code也一起传给后台，造成bug三、如何解决解决当然很简单，就是在每一次区域选择的时

2020-06-01 10:45:21 1639

原创 vue后台管理系统，动态权限路由怎么写。

做后台管理系统，我们经常需要对各个用户进行权限的管理，不同权限的用户所能看到的页面也不相同，那么我们应该怎么做呢。下面，我说说我近期的实战案例。一、编写路由写路由这一步正常写就行，没什么特别的地方{ path: "/", redirect: "/login", children: [] }, { path: "/login", component: Login, name: "", meta: { }, children:

2020-05-25 17:33:02 1391

原创一些实用的windows系统快捷键

一、windows键相关1、windows键+P键：打开小娜，可搜问题，可聊天，可语音调戏。2、windows键+W键：windows ink工作区，有三个便捷小工具，便签、画草图、截屏。截屏还是很方便的，挺好用。3、windows键+E键：打开“我的电脑”。4、windows键+R键：打开“运行”。5、windows键+i键：打开“设置”。6、windows键+P键：打开“投影”，用投影仪的老师以及玩双屏的老铁，自然知道。很方便的快捷键。7、windows键+D键：快速把窗口全部最小化显示，

2020-05-18 16:53:40 1174 2

原创关于弹性盒子的一个bug（父盒子宽度）

最近，在给一个刚开始学前端的朋友解决bug的时候发现了一个关于弹性盒子的bug，这个bug大多数人可能都会忽略，故而分享一下，希望大家不会再踩坑。先上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" cont...

2020-05-07 15:12:37 1508

原创路由导航全局前置守卫router.beforeEach在vue中的运用

router.beforeEach在一个vue项目中的妙用路由是前端非常重要的部分，在vue开发中也是必不可少的。vue router官方文档详细的介绍的关于router的一些功能和用法。这里呢我简单的记录下，在真实项目中，基于vue-cli3构建工具下，router 和 router.beforeEach的搭配使用。beforeEach有哪些参数呢beforeEach总共有三个参数，分别是...

2020-04-27 17:37:46 1408

原创快速的进行日期格式转换

在我们日常开发中，我们经常需要对日期格式进行转换。例如：时间戳转换成年月日（2020年04月14日）年月日转换为中间是杠或者点（2020-04-14）或者干脆就是国际单位这样的操作非常多，基本在每一个项目中都会遇到，手写逻辑虽然不是很难，但是确实是要花费时间。那么，有没有什么包能直接转换日期格式呢？答案是有的。我用到的是moment这个包话不多说，直接介绍moment官网mom...

2020-04-14 11:48:23 852

原创怎样在vue中使用rsa加解密

怎样在vue项目中使用RSA加密在最近的开发中，因为对数据有保密要求，所以需要对所有post请求进行RSA加密操作。加密原理就不多说了，直接上代码说怎么用1、首先我在在工具类文件夹里新建了一个utils.js文件，对加密解密进行封装/** * 工具类 */import Vue from "vue";import JsEncrypt from "encryptlong"; //因为请...

2020-04-08 15:33:01 1529 2

原创 flexbox弹性盒

弹性盒布局（flexbox）一、弹性盒布局介绍1)弹性盒也叫伸缩布局盒模型它是css3引入的一种新的布局模式——flexbox布局，即伸缩布局盒模型，用来提供一个更有效的方式制定、调整和分布一个容器里的项目布局。相比之前的布局方式，更便利于开发。2)主要思想是让容器有能力让其子项目能够改变其宽度、高度（甚至顺序），以最佳的方式填充可用空间（主要是为了适应所有类型的显示设备和屏幕大小）。f...

2020-04-08 14:02:33 138

原创怎样简便的使用vw完成移动端rem适配

怎样简便的完成移动端rem适配了解一些必要的单位px（像素）进行页面开发的基础单位em 相对单位rem 相对单位vw 相对宽度vh 相对高度如何进行简单的px,rem转换了解一些必要的单位px（像素）进行页面开发的基础单位px: 绝对单位，页面按精确像素展示em 相对单位em: 相对单位，相对于父元素的font-size来决定大小rem 相对单位rem: 是相对于根元素（即h...

2020-04-08 13:49:50 641 3

sha虫剂的博客