.故友-CSDN博客

原创移动端电子签名，签名内容移动缩放，生成合同图片（uniapp）

昨天在技术群里看到有人在问电子签名的需求，通过uniapp开发的app，需要实现的签名、签名图片的缩放、拖动、并且和合同一起生成图片。于是利用空闲时间来写了写这个功能。先看下具体效果签名，生成合同。

2022-12-09 10:58:02 2526 12

原创微信小程序码的解析，以及开发中遇到的问题。

在小程序的开发中，我们经常会遇见邀请新用户这种需求，这样我们就需要在分享链接或者小程序码添加一定的参数，让用户点击链接或者扫码，来判断用户的来源。

2022-12-01 14:51:55 2391

原创微信小程序头像昵称填写能力

微信小程序获取头像昵称的能力，最近又进行了一次调整，如果没有记错这是今年第三次调整了，每次调整每个开发者心中我相信都跟我一样，万马奔腾。。。今天写个demo体验下实际效果如何。详细信息请见小程序用户头像昵称获取规则调整公告大概意思呢就是我们为了保护用户隐私，提升用户体验，用户在使用小程序的时候可以选择不使用真实的微信头像昵称，可以从自己本地选择一张图片作为头像，昵称是用户可以手动输入。

2022-11-19 12:00:18 5694

原创实时通信Socket.io的使用

Socket.IO 是一个库，可以在客户端和服务器之间实现低延迟,双向和基于事件的通信。它建立在WebSocket协议之上，并提供额外的保证，例如回退到 HTTP 长轮询或自动重新连接。

2022-11-04 10:35:15 3357 3

原创小白必看，从0开始搭建vue项目

创建项目之前请先确定好，你已经安装了node、npm、vue cli、如果没有安装请自行查看官网进行安装。安装完后我们可以开始进行项目的搭建。

2022-09-23 14:23:18 158

当组件使用了mixin时,mixin中的生命周期函数会先执行,然后在执行组件中的生命周期。mixin对象里的(components、methods、computed、data)这些选项，混入组件时选项会被合并，重名冲突时优先采用组件中定义的数据。mixin中定义的方法和参数在各组件中不共享，即当前组件对mixins的属性的修改，其他也引用了这个mixins的组件不会受影响;mixin中定义的生命周期函数会比引用组件的生命周期先执行,会和组件中定义的methods,created等选项合并调用;...

2022-07-25 15:36:58 7908

原创 element表格el-table排序功能

最近在项目开发过程中遇见一个需求，用户可以根据列表上的数据对列表进行排序，支持正序、倒序、默认顺序。我这里使用的element的table组件，查阅相关文档发现官方提供的有相关方法。当我们按照文档说明进行配置后，可以看到当前列出现了上下的小箭头sort-by表示点击当前列按照指定的属性进行排序，可以设置成id、时间等，非常灵活。我这里是需要按照当前某个字段的拼音的首字母进行排序，所以需要先获取某些字段的首字母保存的我们的list中，下面是获取字段首字母的方法。然后直接对我们的数据进行遍历调用以上方法，拿到

2022-07-08 10:36:23 7938

原创 vue set方法详解

数据双向绑定是vue的一大特点，更改data中的数据时，页面会实时响应，但是在我们的开发过程中可能会遇见以下这种情况，视图不会更新。这是由于 JavaScript 的限制，Vue 不能检测数组和对象的变化。比如我们对data中的对象属性和数组属性进行一些修改时，无法响应式更新渲染到页面，因此vue提供了$set这个API来解决这个限制。vue官网对这一块也有详细的说明。如果我们把alterData这个方法换成如下这种写法，页面视图就能实时更新。如果要修改的值是一个对象...

2022-07-07 16:38:13 4226

原创小程序中调用摄像头，实时获取当前画面信息，可用于扫描实物等场景

我们平时经常会遇到扫描扫码，扫描实物等类似场景，之前工作中遇到一个需求就是用户扫一扫获取当前物品、艺术品的相关信息，后来这块没有做，这几天不忙，刚好趁此机会写个demo，实现相关功能。小程序可以使用uniapp或者微信原生来进行开发，其相关API非常类似。查阅相关文档发现小程序有个这个ApI可以创建并返回 camera 组件的上下文 cameraContext 对象。利用这个API结合camera组件即可实现区域摄像头，在不需要用户收到触发的情况下实时获取当前画面信息，来做进一步处理。代码如下：我这

2022-06-17 11:32:05 6103

原创 vue-element-admin中node-sass换成dart-sass，安装依赖报code 128等问题

在使用vue-element-admin这个后台管理框架中，安装依赖的时候或多或少都会遇见一些问题，其中最常见的莫过于下图这个！这是因为node-sass在windows环境中必须安装python2和Visual Studio才能编译成功。由此可见这个问题多么的。。。现在可以通过把node-sass换成dart-sass来解决这个问题，更换的方式也非常简单。但是有一点需要注意的是，替换 node-sass 之后就是它不再支持之前 sass 的那种 /deep/ 写法，需要统一改为 ::v-deep 的

2022-06-16 14:01:33 1134 1

原创电子围栏绘制、校验、不同坐标系（wgs84，jcg02、bd09）的相互转换，看这一篇就够了！

作为一名前端开发者，在工作中经常会用到地图相关的API，比如百度、高德、腾讯等，但是不同地图平台使用的坐标系可能不一样，这就导致定位时会出现几百米到1000左右的误差，比如在小程序平台获取位置的时候我们可以选择wgs84或者国标gcj02标准，但是如果把这些数据拿到后台用百度地图来显示的话，就会出现几百米的误差，所以就需要对经纬度做一下转换，来抹平各个坐标系之间的差异。本篇文章不仅会介绍不同坐标系的转换，还会介绍电子围栏的绘制与校验。希望能够帮到有需要的人！我这里使用的是百度地图，其他地图请参考相关开发者文

2022-06-10 15:22:53 2724 2

转载从输入npm run xxx发生了什么？

当我们输入npm run XXX会首先去package.json文件里找scripts 里找对应的xxx，然后执行 xxx的命令，例如我下面这个项目输入npm run dev就会执行vue-cli-service serve 这条命令。package.json文件那么问题来了：为什么不直接执行vue-cli-service serve而要执行npm run serve 呢？因为直接执行vue-cli-service serve，会报错，因为操作系统中没有存在vue-cli-servic

2022-05-13 14:05:26 143

原创前端对当前页面进行绘图，并下载。

前端在项目中经常会遇到生成海报、当前页面截图等场景，html2canvas是一个非常不错的选择。他可以通过获取DOM节点去模块区域进行绘图，功能非常强大。官网链接http://html2canvas.hertzen.com/1、首先安装并引入依赖npm install --save html2canvasimport html2canvas from “html2canvas”;2、基本使用html2canvas(document.getElementById("cavansID")).th

2022-05-13 10:26:59 423

原创智能家居--传统风扇改语音控制

最近在玩智能家居，把家里所有的设备一点点改造成了语音控制，根据自己的生活习惯，设置各种联动场景，从此解放双手。但是在改造家里的传统按钮风扇时，我第一时间想到的是智能插座，或者是成本更加便宜的通断器。但是这两种方案都不是太好，不能实现风速的调整，于是这两种方案都被pass。因为我家的小爱音箱都是支持红外设备的，能够学习红外遥控。于是就从这方面寻找，终于被我找到了一款，成本只要几块钱！！！（划重点）就是下面这个电路板，可以接收红外遥控然后就是拆开风扇开始接线，接线方式也非常简单。接线完成，用

2022-04-15 10:15:21 3424 2

原创解决uni-app编译后vendor.js文件过大

GZIPGZIP是网站压缩加速的一种技术，用于优化用户体验，开启后可以加快我们web页面的打开速度，原理是经过服务器压缩，客户端浏览器快速解压的原理，可以大大减少了网站的流量。1、摇树优化摇树优化（Tree-Shaking），顾名思义，摇晃树干，将枯死无用的枝条摇掉，仅保留有用的树枝。对应到框架层面理解，就是一个框架的众多组件和API，可以按需使用，把未引用的框架部分裁剪掉。Tree-Shaking 最早由 Rollup 提出，属于死码删除的一种形式。开启摇树优化的方式非常简单，只需要在manife

2022-03-17 10:50:41 2594

原创 JS浮点数的解决方案

解决办法：1、转为整数（大数）运算。function add(a, b) { const maxLen = Math.max( a.toString().split(".")[1].length, b.toString().split(".")[1].length ); const base = 10 ** maxLen; const bigA = BigInt(base * a); const bigB = BigInt(base *

2022-02-25 11:12:53 729

原创 uniapp环境配置、多种环境运行、打包

1、在项目根目录新增package.json文件{ "uni-app": { "scripts": { "build:test": { "title": "build:test", "env": { "UNI_PLATFORM": "h5", "H_NODE_ENV": "development", "MY_TEST": "jdsfh", "kjdsh": "888899999" } }, "build:pro":

2022-02-25 10:04:12 6539 6

原创后端主动向前端推送消息--SSE

最新项目中需要用到消息的及时推送，在页面的实时展示，之前用过WebSocket这种及时通讯方式，但是WebSocket这种方式对于后端来说相对复杂。所以这次考虑通过其他的方式来实现，于是有了SSE。SSE本质严格说，HTTP 协议无法做到服务器主动推送消息。但是，有一种变通方法，就是服务器向客户端声明，接下来要发送的是流消息（streaming）。也就是说，发送的不是一次性的数据包，而是一个数据流，会连续不断地发送过来。这时，客户端不会关闭连接，会一直等着服务器发送新的数据流，视频播放就是这样的例子。

2022-02-16 09:52:00 6236 1

weixin_44690156的博客