自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(30)
  • 资源 (2)
  • 问答 (1)
  • 收藏
  • 关注

原创 一款极简聊天应用,比较完整,略好看

基于vue3+socket.io的聊天应用

2022-04-15 17:15:45 8679 10

原创 vue+node+socket.io实现客服聊天功能

客服功能介绍:机器人智能聊天客服手动在线离线用户主动向客服发送信息(信息包括文本、表情包)客服选择会话成员,并且主动向用户发送信息(信息包括文本、表情包)用户/客服接收到对方发送的信息客服主动关闭用户会话,离线列表显示离线用户,用户端提示客服主动关闭会话,本次会话结束客服手动离线,清除所有会话列表,用户端提示客服已离线,本次会话结束客服刷新或关闭页面下线,清除所有会话列表,用户端提示客服已离线,本次会话结束用户刷新页面或关闭页面,客服端提示用户已下线,本次会话结束客服切换右边工具栏,选

2021-01-03 10:13:09 9092 47

原创 vue项目部署自动检测更新

这年头前端部署项目,你还在用websocket提醒用户更新?简直太low啦!快来学学如何用指纹对比更新吧~

2023-07-19 08:51:34 1218

原创 原生websocket封装(心跳检测、自动重连)

较全面的原生websocket封装

2023-05-12 09:29:47 1034 1

原创 DIY一款小程序

天啊!小程序也能DIY?

2022-10-10 14:16:16 2839 1

原创 关于pdf.js在IE浏览器二次刷新的报错,我有话说

首先要说的,IE浏览器简直是前端人的噩梦 ,每天一句辣鸡IE,下面我就把我大战IE三天的经历和大家一吐为快1 梦开始项目中要使用pdf预览功能,当时我想:这个我熟阿,pdf.js绝对是首选技术,因为它兼容IE9版本以上,Chrome等主流浏览器更是没问题。于是去pdf.js官网直接找到主流版本2.5.207下载下来,经过一把soul后,最终在Chrome浏览器和IE浏览器打开都能正常预览,心里想:这事到这就算结束了提一嘴:为什么说2.5.207是主流版本,因为该版本对IE的兼容性很好,不少文章都提到过

2022-05-12 21:50:25 1632

原创 FinClip上使用uCharts打造精美可视化报表小程序

FinClip与uCharts结合,打造精美可视化报表小程序

2022-04-18 20:45:10 6377 16

原创 vue通过this.$refs给元素添加水印

createWaterMark() { var width = this.$refs.element.clientWidth; // 元素的ref属性; var height = 2000; var len = width / 80; len = len.toFixed(0); var hen = height / 80; hen = hen.toFixed(0); var init_top = 30; va

2022-04-14 23:07:32 1073 1

原创 实用函数工具库

数字操作生成指定范围随机数export const randomNum = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;数字千分位分隔export const number_format(number, decimals, dec_point, thousands_sep) { /* * 参数说明: * number:要格式化的数字 * decimals:保留几位小数 * dec_poin

2021-10-18 10:59:11 462 1

原创 阿里字体图标使用步骤

搜索字体图标并添加入库将库图标添加至项目更新代码并复制替换文件相应代码新增图标样式使用字体图标<li class="iconfont icon-xinzeng"></li>控制字体图标样式<style> .icon-xinzeng{ font-size:20px; color:#ff9900; }</style>...

2021-09-22 15:49:44 378

原创 CSS3动画

说明动画( animation )是CSS3中具有颠覆性的特征之一,可通过设置多个节点来精确控制一个或一组动画,常用来实现复杂的动画效果。相比较过渡,动画可以实现更多变化,更多控制,连续自动播放等效果。动画的基本使用制作动画分为两步︰1.先定义动画2.再使用(调用)动画定义动画用keyframes定义动画((类似定义类选择器)@keyframes 动画名称{ 0%{ width:100px; } 100%{ width:200px; }}动画序列0%是动画的开始,

2021-07-30 11:46:37 180

原创 屏幕大小适配方案

rem基础rem单位rem (root em)是一个相对单位,类似于em , em是父元素字体大小。不同的是rem的基准是相对于html元素的字体大小。比如,根元素 ( html)设置font-size=12px;非根元素设置width:2rem;则换成px表示就是24px。rem优点rem的优点就是可以通过修改html里面的文字大小来改变页面中元素的大小可以整体控制媒体查询什么是媒体查询媒体查询(Media Query)是CSS3新语法。使用@media查询,可以针对不同的媒体类型定

2021-07-30 10:59:27 752

原创 Sass基础

定义变量与使用元素嵌套写法属性的嵌套写法mixin基本用法传参extend 继承导入外部样式数字运算函数map与相关函数interpolation@each@while@if@forfunction

2021-07-30 09:38:31 179

原创 最优用券方案

如何用代码寻找最优的用券解决方案?这是最近我一朋友找我咨询的业务问题,问我有没有好方法,刚开始看起来确实挺让人头疼,我们用文字列出两种方案,不难发现第一种是无法顺利兑换所有奖品的,但只并不意味着你的券不够额度,而是你的使用姿势不对,如果将使用姿势改成方案二,皆可以满足所有奖品的兑换。那如何用代码去寻找最优解,这是他遇到的难题。我的想法是:首先将奖品不适用用户拥有优惠券的过滤掉,例如戴洛伦的使用范围H1过滤掉,那就是戴洛伦适用:H1,星巴克适用:H2、H3,小甘菊适用H2接着根据适用的券数量从少到多排序.

2021-07-08 17:03:08 305

原创 uni-app实现的数据报表中心小程序

UReport数据报表中心小程序该小程序主要使用了ucharts和wyb-table两插件实现的数据报表功能,感谢作者秋云和SirW的优秀开源项目小伙伴们,如果觉得还不错记得 star 呀快速体验特点使用的是uni-app中最受欢迎的图表uCharts插件完成图表展示,该插件文档详细,且调用简单方便、性能及体验极佳。 ucharts图表插件。使用wyb-tav=ble插件完成表格功能,支持图表排序、滚动等众多功能,上手极其方便。 table表格插件对页面、图表、表格都进行了封装,用户只需要

2021-03-09 16:04:36 3237

原创 一款轻量级拾色器

前言:此次分享目的是为了让更多刚接触前端的人了解这款出色的轻量级拾色器,但功能绝不仅拾色。介绍(网上摘抄):FastStone Capture 是一款强大的、方便的、直观的屏幕捕捉工具。它允许你捕捉屏幕上的任何内容,包括: 活动窗口、对象、整个屏幕、矩形区域、手绘区域以及滚动的窗口/网页。另外该程序还包含了一些创新的功能,例如: 浮动捕捉面板、快捷键捕捉、调整大小、裁剪、文本注释、打印、通过 E-Mail 发送、屏幕放大镜,屏幕直尺,屏幕取色器,屏幕录制器等。说明:前端经常需要拾色,但目前市场拾色

2021-03-02 09:20:15 364

原创 uni-app使用websocket(封装、心跳检测)

实用的小程序websocket轻量封装,便捷引入

2021-01-28 09:50:17 20753 39

原创 不要在v-for中使用v-if

一、前言以下代码写法,相信80%的初学者写过,即使没写过,也应该见过!<ul> <li v-for="product in products" :key="product.id" v-if="product.price < 50" > {{ product.name }} </li></ul>使用 v-if 来过滤 v-for 循环的数据是一个超级大错误!尽管这看起来很直观,但它会导致一个巨大的性能问题。二、原因Vue

2021-01-14 14:07:38 418

转载 nodeJs中修改json文件的数据

// 注意,在内部读取文件不能访问 json 文件中的属性,不知道为什么,所以在外部读取文件const detailArr = require('./data/Details_shoplist_info.json');app.get('/api/modify_details_info',function (req, res) { // 获取 GET 的请求数据 let item = req.query.item; let param = req.query.param; //

2020-12-30 09:51:51 2499

原创 Vue使用vue-quill-editor上传图片路径为服务器路径

前言:vue-quill-editor富文本框插件的使用十分广泛,最近公司需要写一个指导文档,但发现上传图片时,是直接将图片转成base64显示的,此时提交的文本编辑器内容肯定也是一大串的html+图片base64字符串,这当然不能直接存到数据库数据库去,除非你不怕后端的一顿暴揍解决思路:vue-quill-editor有开放很多的扩展和自定义方法,我们通过在mounted初始化中获取自己的toolbar工具栏中的image,劫持image的handler方法,调用我们页面上一个隐藏的input:f

2020-12-17 09:42:28 1754

原创 Vue监听store中数据变化的两种方式

方式一watch: { "$store.state.userInfo.Name":{ handler:function(newVal,oldVal){ console.log(newVal,oldVal); } }}方式二computed: { isEdit () { return this.$store.state.userInfo.Name;  //需要监听的数据 }},watch: { isEdit(newVal, oldVal)

2020-12-10 13:52:56 27493

原创 Vue/uni-app倒计时

导读:在平时,倒计时的运用场景非常多,比如新年倒计时、商品的开抢倒计时,因此把倒计时做好十分必要,我们先看下效果图。@[TOC]效果图一、效果图@[TOC]4步走二、实现该效果并不难,只需要4步走注意:下面代码以Vue为例,如果需要实现uni-app,则改动html的元素,并且引入组件即可(1)封装倒计时的组件<!-- 子组件活动倒计时 --><template id="countBackwards"> <div class="uni-countdown"

2020-12-04 10:14:21 628

原创 uni-app小程序打开地图选取自定义地址

一、看下效果图二、在页面写上地图标签<map style="width: 100%;height: 97%;" id="myMap" :markers="markers" :longitude="longitude" :latitude="latitude" scale='16' @markertap="handleStore"></map>markers:存放地图上面的地址标签数组对象longitude、latitude:当前定位的经度、纬度scale:地图缩放比例

2020-07-28 17:51:59 3456

原创 小程序uni-app生成二维码

一、看下效果图二、废话不多说,直接上代码1.页面增加存放二维码的标签<canvas class="bar_code" canvas-id="Qrcode"></canvas>2.引入qrcode.js,后面会放上import qrCode from "../../utils/qrcode.js"3.在自己的methods中写入生成二维码的方法qrCode.api.draw(this.info.CardNo,{ctx:uni.createCanvasContext('

2020-07-28 16:48:43 5669 14

原创 小程序uni-app生成条形码

一、看下效果图二、废话不多说,直接上代码1.页面增加存放条形码的标签<canvas class="bar_code" canvas-id="Brcode"></canvas>2.引入barcode.js,后面会放上import brCode from "../../utils/barcode.js"3.在自己的methods中写入生成条形码的方法brCode.code128(wx.createCanvasContext('Brcode'), coupon.GiftN

2020-07-28 11:14:13 6196 29

原创 小程序uni-app滚动页面时触发动画

一、先来看看我们要实现的动画效果二、废话不多说,直接上代码1.首先在页面上放上需要动画的元素,我的动画为一张图片<image :src="serviceImg" mode="widthFix" :animation="animationData" class="service_img" @click="toService"></image>其中animation为我们的动画属性,我们需要给它绑定一个变量,假设是:animationData2.在数据data添加anima

2020-07-28 10:31:26 3584

原创 纯html,css,jquery实现打地鼠游戏

最近公司想上线一个打地鼠游戏,我被安排到了写页面,网上找了很多demo,发现不是太简单就是写的根本看不懂,于是下定决心自己写了一个demo,真正实现该功能的代码并不多,也就一两百行代码,下面我附上游戏的图1.进入界面2.规则3.游戏页面4.失败页面5.游戏页面6.挑战成功7.下载链接https://download.csdn.net/download/weixin_42000816/12442580...

2020-05-21 11:37:58 562

原创 C#敏感词过滤Demo

1.创建一个Filter类using System;using System.Collections.Generic;using System.Linq;using System.Text;namespace FoundationHelper{ #region 非法关键字过滤 bate 1.1 /// <summary> /// 非法关键词过滤(自动忽略汉字数字字母间的其他字符) /// </summary> public cla

2020-05-20 11:06:05 534

原创 C#调用MYSQL的存储过程

1.创建存储过程CREATE DEFINER=`root`@`%` PROCEDURE `SearchProduct`( IN theSort VARCHAR(500), --参数1 IN queryContent VARCHAR(500), --参数2 IN theSourceId INT, --参数3 IN pageIndex INT, --参数4 IN pageSize INT --参数5)BEGIN IF queryContent IS NOT NULL THEN set

2020-05-20 10:51:58 1595

原创 C#读写Json数据到本地.txt文件

1.写文件到本地//指定日志文件的目录 string fp = Server.MapPath("~/Content/Json/store.txt"); if (!System.IO.File.Exists(fp)) // 判断是否已有相同文件 { FileStream fs1 = new FileStream(fp, FileMode.Create, FileAcce

2020-05-20 10:36:44 2875

纯html打地鼠游戏demo.zip

该打地鼠demo注释清晰,有打击声音,最后计算积分奖励,纯jquery实现,注释全面,小白应该看懂都不成问题,具体页面可以看:https://blog.csdn.net/weixin_42000816/article/details/106253103

2020-05-21

盘古分词及管理工具.zip

文件包括盘古分词Demo以及管理工具,可自由实现对词库的动态管理,积分的话也算比较适合,不懂使用的话也可以进行私聊教程

2020-05-20

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除