- 博客(102)
- 收藏
- 关注
RSS订阅
原创 开发常用方法记录
1，获取数据类型 getType() { var obj = Array.prototype.shift.apply(arguments); var toString = Object.prototype.toString; var map = { "[object Boolean]": "boolean", "[object Number]": "number", "[object String]": "str
2022-03-14 22:07:41
989
1
原创 Date相关日期格式转换
需要注意的一点：下面的方法之间是存在相互调用关系的。/** * * 获得当前时间 */ var getCurrentDate = function() { return new Date(); };/** * * 将给定时间转换为时间字符串形式,如： 2019-07-18 */ getNowDate(time) { var date = new Date(time) var seperator1 = '-' var year =
2020-09-15 23:51:37
5237
原创 开发常用正则验证表达式
// 合法urlexport function validateURL(textval) { const urlregex = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1...
2020-04-21 17:47:59
1596
1
原创 JavaScript知识点
****JavaScript语言构成 一个完整的JavaScript实现应该由下列三个不同的部分组成： >>核心（ECMAScript） 主要包含这门语言的主要组成部分：语法、类型、语句、关键字、保留字、操作符、对象。 基本数据类型包括 Undefined、Null、Boolean、Number、String。按值访问 ......
2019-11-13 19:01:55
254
原创 vue 请求代理 proxy
同源策略是浏览器厂商提出的web安全策略，是浏览器最核心也最基本的安全功能，同源即：协议（http等）相同，域名（www.baidu.com等）相同，端口（8080等）相同，只要有一个不同就违反了同源策略。
2023-10-11 19:05:30
1133
原创 地图相关坐标转换及说明
WGS-84坐标系 是国际标准坐标系，GPS坐标（Google Earth使用、或者GPS模块）GCJ-02坐标系，即火星坐标系，是由中国国家测绘局制订的地理信息系统的坐标系统。它是一种对经纬度数据的加密算法，即加入随机的偏差。国内出版的地图系统包括腾讯地图和高德地图都采用了GCJ-02火星坐标系。出于国家安全考虑，必须至少采用GCJ-02对地理位置进行首次加密。BD-09，即百度坐标系，也就是在GCJ-02的基础上，进行了BD-09二次加密措施生成的一种坐标系。
2023-10-11 11:59:27
215
原创 git commit 提交校验详解
本文主要探索 git commit 时代码提交校验的实现，日常开发我们使用 git 来管理代码，依赖于第三方插件husky，commitlint等，我们可以实现 git commit 提交校验。husky用来在 commit 前校验代码格式正确性，commitlint 用来校验 commit 提交内容的格式的正确性实现 git commit 提交校验的原理其实是依赖于 githooks，即git 使用的挂钩。............
2022-08-18 18:59:39
3837
1
原创 vue 常用自定义指令
说明/*** 自定义指令对象可以接收的钩子函数* bind 只调用一次，指令第一次绑定到元素时调用* inserted 被绑定元素插入父节点时调用* update 所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前* componentUpdated 指令所在组件的 VNode 及其子 VNode 全部更新后调用* unbind 只调用一次，指令与元素解绑时调用*/...
2022-04-12 23:19:35
1832
原创 前端利用jsencrypt.js进行RSA加密
什么是RSA加密RSA加密算法是一种非对称加密算法，RSA加密使用了"一对"密钥.分别是公钥和私钥,这个公钥和私钥其实就是一组数字!其二进制位长度可以是1024位或者2048位.长度越长其加密强度越大,目前为止公之于众的能破解的最大长度为768位密钥,只要高于768位,相对就比较安全.所以目前为止,这种加密算法一直被广泛使用。RSA加密与解密使用公钥加密的数据,利用私钥进行解密 使用私钥加密的数据,利用公钥进行解密相关文档：前端利用jsencrypt.js进行RSA加密实践：使用j
2022-03-15 15:47:31
2230
原创 vue slot 插槽使用详解
vue 对于前端的重要性不言而喻，日常开发中要用好vue，学会使用插槽是很重要的，且组件的开发也是离不开 slot，无论是移动端或pc都是如此。下面说说vue slot 的相关知识点：
2022-02-09 00:21:18
6500
原创 uniapp 小程序车牌号输入键盘
之前写微信小程序时封装了车牌号输入键盘，记录在微信小程序组件中了，最近开发uniapp又重新开发了车牌号输入键盘组件，是在微信小程序开发的键盘组件的思想上做了一版优化，增加了挂车车牌号输入，及新能源车辆车牌号输入功能，功能如下：html<template> <!--车牌号输入组件--> <view v-if="show" class="trailer-keyboard"> <u-popup :show="show" :closeOnCli.
2022-02-08 23:47:41
4090
22
原创 uniapp小程序微信支付功能
1. 微信公众号认证，并开通微信支付。2. 小程序绑定微信支付（小程序管理后台左侧点微信支付，然后按提示操作）3. 获取开发必要参数开发参数包含：APPID：小程序 appIDMCHID：商户号KEY：商户支付密钥， 设置地址：https://pay.weixin.qq.com/index.php/account/api_certAPPSECRET： 获取地址：https://mp.weixin.qq.com/advanced/advanced？action=dev&t=adv
2022-01-18 02:23:53
28927
原创 uniapp 安装配置 uView ui
uView UI，是全面兼容nvue的uni-app生态框架，在 uniapp 项目中使用 uView ui 有三种方式：通过Hbuilder X 导入方式 使用 NPM 安装方式 下载导入方式前两种方式，uView 官方文档已经做了很详细的说明，请查阅。下面主要说第三种，下载导入方式。1.下载 uView 插件下载地址：https://ext.dcloud.net.cn/plugin?id=1593，下载插件ZIP，如下：在自己的项目根目录新建 uview-ui 文件夹...
2022-01-09 19:11:00
1116
原创 组件二次封装之自定义 v-model
vue2.0基于 uniapp uView UI 封装时间组件v-model 的实现借助官方提供的model 选项，其实可以理解为一个语法糖用props 来接收父组件的数据，子组件通过model选项派发一个更新父组件数据的方法v-model 可以理解为下面两步：:value="value" @input="value=$event.target.value"来看vue 官方对 model 选项的描述：允许一个自定义组件在使用v-model时定制 prop 和 event。..
2022-01-06 22:50:38
6049
原创 uniapp 封装时间选择器组件
本来项目基于uView UI 2.0版本开发的，时间组件本来是基于 uView dateTimePicker 组件做的二次封装，但是dateTimePicker 组件没有选择秒的功能。所以基于 uniapp 的 picker-view 组件封装，如下：HTML<u-popup :show="show" mode="bottom" :round="round"> <view class="time-content"> <view class="hea.
2022-01-06 22:30:40
4127
原创 微信小程序组件（车牌号输入，支付键盘，滑块验证）
车牌号输入组件如图基于微信小程序组件封装，输出值为当前选择车牌号，可回显车牌号。支持7位8位车牌号，因为我的项目没有此需求，所以没有测试，具体功能待验证。话不多说，上代码。json文件{ "component": true, "usingComponents": { "van-overlay": "@vant/weapp/overlay/index", "van-divider": "@vant/weapp/divider/index" }}
2021-12-05 23:22:08
2247
原创 微信小程序配置wxml文件高亮及格式化
使用 vscode 插件wxml-vscode 格式化微信小程序 wxml 文件。1，安装：vscode 扩展商店搜索wxml-vscode ，安装。2，配置在 vscode setting.json 文件中配置，如下：// 高亮的颜色，emm暂时只支持这样写 "wxmlConfig.activeColor": { "color": "#e5c07b" }, // 是否禁用高亮组件 "wxmlConfig.activeDisable": false, /..
2021-11-18 21:17:00
4225
原创 vue表单级别状态管理（vuex plugin 插件使用分享）
分享重点：1，组件级状态管理（vuex）的使用2，vuex plugin 使用3，表单数据处理上面三个其实是互相嵌套，相互制约，共同协作来完成任务的。1，在当前组件根目录注册store，新建store.js 文件，如下：import Vue from 'vue'import { SET, EDITED, LOAD, MERGE, SELECT_CARRIER_SUG } from './constants' // 常量import adaptor from './adapt
2021-11-11 18:31:50
2393
原创 EditorConfig 使用详解
EditorConfig 有助于为跨各种编辑器和 IDE 处理同一项目的多个开发人员维护一致的编码风格。EditorConfig 项目由用于定义编码样式的文件格式和一组文本编辑器插件组成，这些插件使编辑器能够读取文件格式并遵循定义的样式。
2021-09-24 20:42:18
15359
原创 Prettier 代码格式化工具使用详解
什么是Prettier？借用官方的话来说，Prettier 是一个固执的代码格式化程序，它删除所有原始样式*并确保所有输出的代码符合一致的样式。所以，Prettier 是一个代码格式化工具，可以在多人协作开发中能让每一行代码保持一致的风格，Prettier 是一种代码风格指南，Prettier 提供了很多的配置项和API，你可以有选择的配置你想要的代码风格，并使用Prettier 来进行统一格式处理。Prettier 支持：JavaScript（包括实验性功能） JSX 角 视图..
2021-09-23 18:26:18
6234
原创 ECharts进度条，环饼图，折线图案例记录
ECharts 没有提供进度条类型的图表，但是可以根据仪表盘类型修改得到，上图官方文档请看：ECharts官方配置项文档上代码：<template> <div class="box-container"> <BoxHeader info="车辆类型" utils="万辆" type="dis" /> <div class="content"> <div class="item_image"> <d..
2021-09-14 20:33:09
6827
原创 VS Code 设置解析及保存代码格式化问题
问题的由来是这样的，git 上拉去的代码，用vscode打开，随便打开一个vue文件，习惯性的 Ctrl + S 保存了，然后 git 显示文件有更改，查看工作树，显示是这样的这个问题困扰了好久，网上各种查找，各种修改配置，都不起作用，不过最终还是解决了，先上解决办法，............
2021-09-09 18:12:06
13338
2
原创 postcss 是什么东西？(优秀文章收集)
PostCss是一个用 JavaScript 工具和插件转换 CSS 代码的工具。它的主要作用如下：1，增强代码的可读性利用从 Can I Use 网站获取的数据为 CSS 规则添加特定厂商的前缀。Autoprefixer自动获取浏览器的流行度和能够支持的属性，并根据这些数据帮你自动为 CSS 规则添加前缀。2，将未来的 CSS 特性带到今天PostCSS Preset Env帮你将最新的 CSS 语法转换成大多数浏览器都能理解的语法，并根据你的目标浏览器或运行时环境来确定你需要...
2021-09-03 19:02:50
1841
原创 git登录报错，git clone无法记住用户名密码，修改git提交用户名
报错如下：这种问题可能是因为你使用的电脑是之前别人用过的，git的用户信息存储的还是之前登录人的账户密码，所以导致你无法成功拉取代码的问题，那么，就需要先注销别人的用户名及密码，如下，输入:git config --system --unset credential.helper现在你可以重新 clone 了，登录你的用户名及密码便可。那么，还有一个问题，就是你每次 git pull 都需要重新登录用户名，密码，是不是很烦，或者是你第一次登录用户名密码可以正常 拉取，但是后面.
2021-07-19 20:26:40
2031
原创 vue transition 动画基本使用
关于 transition 的属性的了解还是直接看官网吧，这里不做阐述。基本使用方式了解一下：<div class="animation_content"> <el-button type="primary" @click="animationClick" style="margin-bottom: 100px;" >状态切换</el-button> <
2021-06-24 18:44:43
299
原创 Vue 使用 better-scroll
首先，什么是 better-scroll ？它是用来干什么的？better-scroll是一个移动端滚动的解决方案，它是基于 iscroll 的重写，它和 iscroll 的主要区别在这里。better-scroll 也很强大，不仅可以做普通的滚动列表，还可以做轮播图、picker 等等。...
2021-06-05 16:49:18
1103
原创 elementUI tooltip箭头样式(表格自定义)
需求：修改 table 中 tooltip 的样式及位置。尝试：但是表格中 tooltip 默认是挂载到body中的，修改当前表格 tooltip 样式，全局都会受影响，
2021-06-01 11:47:45
4801
原创 使用node起服务加载本地文件
1，创建文件夹2，执行 npm init -y3，安装依赖npm i express compression4，创建服务创建 index.js 文件，输入内容：const express = require('express')const compression = require('compression')const app = express()app.use(compression())app.use(express.static('./dist'))...
2021-04-30 16:46:36
307
原创 http请求属性 Accept enctype Content-Type
enctype 是什么表单（<form>）用来收集用户提交的数据，发送到服务器。比如，用户提交用户名和密码等。而要将用户的数据传递到后台就需要 HTTP请求，表单提供四种编码方式向后台传递相应的数据，而编码格式由表单的 enctype 属性决定。enctype 属性决定了 HTTP 头信息的 Content-Type字段的值，默认情况下这个字段的值是 application/x-www-form-urlencoded。GET 方法如果表单使用GET方法发送数据，en...
2021-04-12 16:31:04
1384
原创 File、URL、Base64、Blob、ArrayBuffer格式转换，图片压缩
图片转base64/** * 图片转base64 */ convertImgToBase64(url, callback, outputFormat) { let canvas = document.createElement('CANVAS'), ctx = canvas.getContext('2d'), img = new Image img.crossOrigin = 'Anonymous' img.onload =
2021-03-12 18:35:19
1370
原创 elementUI dialog弹窗相关问题
打开dialog，内容被遮罩层挡住了这是因为遮罩层默认是插入到body元素上的，所以会遮挡当前的内容，修改dialog默认属性即可// dialog标签添加下面属性// 作用：遮罩层是否插入至 body 元素上，若为 false，则遮罩层会插入至 Dialog 的父元素上:modal-append-to-body="false"使用双层嵌套的dialog时，关闭内层的dialog，而遮罩依然存在这是因为，在使用双层嵌套的dialog时，需要将dialog全部内容插入到bo..
2021-03-12 18:31:18
1174
原创 JavaScript Function中你可能不知道的知识点
函数是一段可以反复调用的代码块。函数还能接受输入的参数，不同的参数会返回不同的值。函数的声明function命令function print(s) { console.log(s);}函数表达式var print = function(s) { console.log(s);};Function 构造函数var add = new Function( 'x', 'y', 'return x + y');// 等同于function add(x,..
2021-03-12 17:53:15
333
原创 vue-quill-editor 富文本编辑器
import cookie from '@/storage/cookies'import { Message } from 'element-ui'import emojiList from "@/components/chat/announcement/js/emojiList"const emojiIcon = '<svg class="i" viewBox="0 0 24 24"><use href="#emoticon-happy"></use><.
2021-03-11 21:57:46
989
原创 git stash用法总结
git stash 命令可用户保存工作区所有文件的修改，和恢复工作区文件的修改，可跨分支恢复。事情是这样的，新拉取的代码忘记切换分支了，直接在release分支上进行的修改，发现分支错误的时候已经改的挺多文件了，因为release是保护分支，所以没有提交权限，所以只能就是放弃所有更改，切换分支重新做，而不用放弃当前更改直接把你当前的更改带到新分支，便可以用 git stash 命令来实现。git stash保存当前所有文件的工作进度，将工作区和暂存区恢复到修改之前。git stash.
2021-03-10 18:32:50
1414
1
原创 js中的事件冒泡，事件捕获，默认事件
js中的事件传递方式有两种： 冒泡 和 捕获。事件冒泡js中事件会以冒泡的形式由内到外的向上传递。由最内层点击元素向外扩散到最外层元素，激活外层注册的相应事件，这就是事件冒泡。事件冒泡是js语言中事件的传递过程，传递方式，我们会需要用到它来做一下事情，但有时它的存在也会影响我们的操作。使用：事件代理(事件委托)什么是事件代理：利用事件冒泡的特性，将本应该注册在子元素上的处理事件注册在父元素上，使用父元素来代理多个子元素的事件。这样做可以减少DOM操作，减少事件的注册步骤，提升性能
2021-03-04 20:25:05
1622
3
原创 elementUI checkbox选中回显操作注意事项
具体的详情介绍请看，elementUI checkbox。checkbox的回显操作是基于el-checkbox-group 标签v-module绑定的数组来实现回显，这个数组可以是一维数组，也可以是数组对象，具体使用那个都行，不同点在于，el-checkbox 标签绑定的lable值的不同，如果 group 标签绑定的是数组对象，则 lable 绑定的是每一个对象；如果group 绑定的是一维数组，则 lable 绑定的是每一个对象中的具体值。<template> &l.
2021-02-20 19:17:21
6539
4
原创 vue图片裁剪插件vue-cropper使用 （FileReader 函数 | URL.createObjectURL 方法）
感觉这个挺有意思的，所以就弄了，也需要了几个知识点，顺带学习了，记录一下。主要用到的是 vue-cropper 截图插件，具体的安装，引入，使用请看 vue-cropper官方文档 ，很详细了，这里不赘述。效果如图：在硬菜之前先来点前菜吧，使用中遇到的东西，记录一下：1，FileReader 函数FileReader对象允许Web应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用File或Blob对象指定要读取的文件或数据。FileReade...
2021-02-08 19:02:29
2434
原创 自定义右键菜单
主要用到 oncontextmenu 事件：oncontextmenu 事件在元素中用户右击鼠标时触发并打开上下文菜单。下面是自己写的小demo：// prevent 禁用浏览器默认的右键事件<div @contextmenu.prevent="rightClick"> <div class="rightList"> <div class="list_item" @click="rightOneClick">你瞅啥</div
2021-02-06 17:51:41
330
原创 阿里云OSS上传文件设置请求头
之前写过一篇发送文件消息的，原生input上传文件（聊天发送文件消息），那么这次的需求就是更改上传地址，使用阿里云OSS上传。那么，这次选择使用elementUI的upload插件，样式各位大哥根据自己的需求实现吧。要使用OSS，首先需要安装，引入，创建，这里就不详解了，推荐一遍文章：阿里oss前端上传使用。这位大哥是基于promise来创建OSS，也可以选择不使用Promise：data(){ return { ossConfig: { // ossConfig 的内
2021-02-05 21:19:50
7107
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人