自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(47)
  • 资源 (1)
  • 收藏
  • 关注

原创 微信小程序input type=nickname不能触发隐私政策?小程序隐私协议开发指南之nickname权限篇

对于 input type=“nickname” 组件,由于 input 的特殊性,如果用户未同意隐私协议,则input type=“nickname” 聚焦时不会触发 onNeedPrivacyAuthorization 事件,而是降级为 input type=“text”,导致不能拉起微信昵称。为规范开发者的用户个人信息处理行为,保障用户合法权益,微信要求开发者主动同步微信当前用户已阅读并同意小程序的隐私政策等收集使用规则,方可调用微信提供的隐私接口。接下来看实现代码:(基于uniapp)

2023-11-30 15:06:44 1155

原创 微信小程序页面返回操作拦截

小程序如果在页面内进行复杂的界面设计(如在页面内弹出半屏的弹窗、在页面内加载一个全屏的子页面等),用户进行返回操作会直接离开当前页面,不符合用户预期,预期应为关闭当前弹出的组件。为此提供“假页”容器组件,效果类似于 popup 弹出层,页面内存在该容器时,当用户进行返回操作,关闭该容器不关闭页面。目的是重写左上角返回按钮,可以加入自己的业务判断拦截。在页面内容外组件 page-container 组件。首先要在 pages.json 文件加配置。重写navigationBar。

2023-04-06 17:18:15 2971 1

原创 封装时间处理函数,让你更快捷的处理时间业务

包括获取当前日期、获取指定日期、计算日期差、计算两个日期的月份差、获取当前月有几天。

2023-03-07 15:32:36 358

原创 uniapp封装缓存方法,支持类似cookie具有过期时间

set用来设置缓存,get用来获取缓存大概逻辑如下:1、将接收params参数,包含key、data、unit、time2、判断key和data不能为空,防止设置缓存时出错3、判断unit参数,分别处理缓存过期时间4、判断缓存size是否超上限,并及时清除5、设置缓存,并以’|'字符分割过期时间戳6、实现代码如下:3、完善get逻辑大概逻辑如下:1、将接收要获取的缓存key2、判断key不能为空3、获取缓存4、获取当前的时间戳,与缓存时间错比较,以判断缓存是否过期5、获取指定缓存ke

2023-03-07 15:04:54 1600

原创 uniapp连接蓝牙硬件及硬件数据传输(公用类封装,简单易用)

蓝牙连接设备前,首先会想到一些各种的状态,比如等待连接、搜索设备中、已连接、连接失败等等一系列的状态监听,所以这里先定义好相关状态,以便业务逻辑判断。/*** 蓝牙不可用label : '请检查手机蓝牙是否开启' , code : - 1 } , /*** 等待连接蓝牙label : '等待连接蓝牙' , code : 10000 } , /*** 等待连接蓝牙(重启蓝牙适配器)label : '等待连接蓝牙' , code : 10001 } , /*** 正在搜索设备...

2023-02-11 13:46:50 4522 9

原创 uniapp封装路由,使用路由名称跳转

使用uniapp时,个人感觉有个很不友好的点:当项目比较复杂且文件夹分的比较细时,跳转路由书写代码时会有很长的一行路由代码;(强迫症)比如:/home/project/list/cate/detail为解决这个问题,封装了一套使用路由名称作为跳转路由的方法(类似于Vue路由)

2023-02-08 11:32:46 1804

原创 蓝牙发送数据到设备异或和计算

蓝牙发送数据到设备异或和计算

2023-01-16 14:39:04 134

原创 uniapp蓝牙硬件广播扫描

大致步骤如下:1. 初始化蓝牙适配器2. 开始搜索设备3. 发现外围设备4. 获取所有已发现的蓝牙设备5. 判断当前设备6. 解析蓝牙设备的广播数据段中的 ManufacturerData 数据段接下来代码实现如果觉得有用随手点个赞吧,谢谢关注我,不定时分享技术干货~

2022-10-26 17:52:56 1162 2

原创 Flutter实现页面状态缓存的几种方法

有以下两种方法:1、使用IndexedStack组件缓存页面IndexedStack组件会把组件一次性先创建好,堆叠窗口,通过index切换显示对应的窗口2、使用PageView组件,组件混入AutomaticKeepAliveClientMixin配合使用**(推荐使用)**然后在需要缓存的组件里混入AutomaticKeepAliveClientMixin如果觉得有用随手点个赞吧,谢谢关注我,不定时分享技术干货~扫二维码关注公众号...

2022-06-20 11:34:54 4024

原创 一行代码实现「远程搜索」匹配搜索关键字,实时高亮显示

一行代码实现「远程搜索」匹配搜索关键字,实时高亮显示

2021-12-21 10:19:49 459 1

原创 H5端rem自适应屏幕

计算设计图尺寸与窗口宽度,窗口宽度放大100倍即1rem = 100px在head标签中引入,让页面一加载就适应屏幕; (function (win) { var tid; function refreshRem() { let designSize = 1920; // 设计图尺寸 let html = document.documentElement; let wW = html.clientWidth;// 窗口宽度

2021-12-10 18:38:33 780

原创 js提取企业名称的关键字(简称),生成文字LOGO

> 实现思路:> > 1、判断用户键入的字符串长度,长度 2、判断字符串是否以 “xx省” 开头,如果是则删除该部分> 3、判断字符串是否以 “xx市” 开头,如果是则删除该部分> 4、判断字符串后缀是否以 “xxxx” 结尾,例如“有限公司”,如果是则删除该部分 > 5、判断字符串中是否存在特殊符号,例如 “(xxxx)”,如果存在则删除该部分> 6、考虑“不是常规的”企业名称(以上过滤截取过程均被跳过),或者以上过程截取完之后长度 >4 ,则直接截

2021-06-03 11:37:36 3355

原创 基于uniapp开发[新大陆]安卓设备应用扫码监听功能

收到项目需求,开发新大陆扫码枪的安卓应用开发需求背景:客户仓库产品进出库操作,二维码扫描识别,记录产品信息,库存数量等等终端设备:新大陆智能终端基于uniapp开发混合App,使用uniapp扩展原生App能力下面是核心逻辑代码let error = 1//新大陆 智联天地 N7000R 获取方法 //#ifdef APP-PLUS console.log("新大陆--------------------开始监听!");var main = plus.android.runtime

2021-06-01 12:03:44 1156 1

原创 微信内H5页面跳转小程序

如果所使用的标签允许提供插槽,由于插槽中模版的样式是和页面隔离的,因此需要注意在插槽中定义模版的样式。另外,对于具名插槽还需要通过slot属性声明插槽名称,下文标签插槽中的default插槽为默认插槽,可不声明插槽名称。已认证的非个人主体的小程序,使用小程序云开发的静态网站托管绑定的域名下的网页,可以使用此标签跳转任意合法合规的小程序。已认证的服务号,服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。系统版本要求为:iOS 10.3及以上、Android 5.0及以上。

2021-04-23 10:02:17 722

原创 Vue3.0 — element-plus 表单嵌套表格实现动态表单验证【实战】

我想有不少小伙伴都有遇到过表单嵌套表格,那么在这种情况下怎么实现动态验证呢?(即表单项可以动态添加/删除)效果图如下表格有添加和删除按钮,点击提交进行表单验证element官方有给出表单动态验证的方法,但是实际上大多数项目的需求无法满足,所以需要在其基础上进行修改首先data格式必须是对象包裹数组forms: { tableData: []}然后表单绑定form数据<el-form ref="forms" :model="forms">表格绑定tableData数据

2021-04-10 20:00:36 11961 10

原创 Vue 修改data数据后视图没同步更新的解决方案

导致视图不同步更新的原因是因为对象数据嵌套太深,导致vue监听不到数据变化,render函数不会自动更新解决方案一:使用this.$set()方法重置属性语法:this.$set(object, key, value)this.$set(this.labels[index], 'select', !this.labels[index].select)如果还搞不定它就用下面的方法解决方案二:数据修改后调用this.$forceUpdate()强制更新视图this.labels[index].

2021-03-25 18:40:06 1892 1

原创 Vue3.0 使用print打印功能(兼容vue3.0)

npm上没找到兼容vue3.0的print打印功能,于是找到了兼容vue2.0版本的print,在此基础上修改,兼容3.0现已将修改后的兼容版本上传到了npm,可直接安装使用npm i print-vue3.0 --save

2021-03-24 16:38:32 3291 8

原创 Vue filter 实现文章更新日期--时间戳

Vue.filter('formatTime', function(time) { const d = new Date(time); const now = Date.now(); const diff = (now - d) / 1000; if (diff < 30) { return "刚刚"; } else if (diff < 3600) { return Math.ceil(diff / 60) + "分钟前"; } else if (diff < 360

2021-03-19 11:17:45 141

原创 记录:子组件相互嵌套导致不渲染的解决方案

简单解释下嵌套场景:A组件中嵌套了B组件B组件中嵌套了A组件C组件也嵌套了A组件或者B组件类似这种循环相互嵌套的组件(很少有这么狗需求了吧,建议项目中不要这么嵌套)这种嵌套方式会导致 比如B组件在A组件可以正常渲染,然而在C组件不渲染经过一番调试,将组件注册到了全局下,得以解决,将此记录下来如果小伙伴们也遇到了类似问题那么可以将这些组件注册到全局可以解决这个问题...

2021-03-11 17:26:38 609

原创 补充:(方案二)vue路由hash模式(带#)微信公众号首次授权后ios总是跳首页的问题

解决方案一 请看我另一篇文章 方案一利用 .html 文件作为中转页面进行路由重定向该页面在 static 文件夹下(vue打包时不会被编译),并只做 js 处理:截取参数解码——> 跳转页面<script> let url = location.href.split('?') let pars = url[1].split('&') let data = {} pars.forEach((n, i) => { let p =

2021-02-25 11:41:19 1102

原创 jQuery懒加载 lazyload,支持video、image

jQuery版本下载:https://www.jq22.com/jquery-info122lazyload下载:https://appelsiini.net/projects/lazyload/$(document).ready(function ($) { $(".lazyload").lazyload({ effect: "fadeIn", //没有加载图片时的临时占位符 // placeholder: "images/default.png

2021-01-25 10:41:17 745

原创 vue2.x vue3.x ECharts中国地图散点图,含China.js文件以及中国地图JSON文件

因公司项目需求,需要实现中国地图数据散点分布,如下图按照ECharts官方文档给出的示例,并没有单独的中国地图,需要自己去找配置文档修改配置,达到自己想要的结果实现这一模块需要有china.js这个关键的文件进行处理,否则会报错意思是 [地图中国不存在。必须提供地图的GeoJSON。]因此还需要有中国地图的JSON文件(这文件可不好找,ECharts官方不提供下载)中国地图GeoJSON下载链接以下是china.js文件的代码(function (root, factory) { if

2021-01-20 15:22:50 3042

原创 兼容uniapp在小程序端IOS圆角不生效的问题

/* 兼容IOS圆角 */.br {-webkit-backface-visibility: hidden;-webkit-transform: translate3d(0, 0, 0);}

2020-09-14 10:21:28 1229

原创 vue 简单的tab切换滑动效果

实现一个简单的滑动效果:代码逻辑比较简单,利用css的transform和transition属性实现简单的tab切换效果贴上代码,仅供参考:html部分:<template> <div class="container"> <div class="flex_c"> <p style="margin-right:20px;" @click="tab('0')">切换</p>

2020-08-14 17:43:12 3245 4

原创 初入uni-app踩坑记录(image组件绑定本地图片不显示问题)

image组件正常渲染图片地址<image src="@/static/avatar.png" mode="">这种方式引用是可以正常显示的因业务需求,需要动态绑定图片资源链接,代码修改如下:<image :src="userInfo.avatar || avatar" mode=""></image>data() { return { us...

2020-04-07 14:41:52 14968 1

原创 Vue上拉框显示隐藏动画简单demo

css简单布局.picker { height: 300px; background: #fff; width: 100%; position: fixed; left: 0; bottom: 0; z-index: 2020; overflow-y: scroll; box-shadow: 0 0 12px 0 #f4f4f...

2020-03-03 11:16:29 860

原创 小程序页面自定义顶部到航栏

小程序顶部到航栏可全局设置也可以局部设置全局设置只需在app.json中window对象添加"navigationStyle": “custom"配置,然后每个页面的顶部导航条都是自定义的局部设置(单个页面),在你需要自定义的页面的json文件中添加"navigationStyle”: "custom"配置即可下面上代码首先获取顶部导航栏的高度,注意ios和安卓的高度不一样 cus...

2019-12-30 09:35:58 337

原创 父子组件与兄弟组件之间的通信

1、父子组件通信1.1 父传子 ----------------------------------------------------------父组件传值到子组件使用 props父组件代码:<template> <div> <child :msg="parentMsg"></child> </div...

2019-12-27 13:40:50 207 1

原创 顶部导航栏下划线跟随鼠标移动

css部分:#slidebar { height: 3px; width: 64px; background: #1476CB; position: absolute; left: 35px; bottom: 0px; transition: left .3s;}html部分:js部分:给元素添加mouseover(移入)、m...

2019-11-25 16:21:05 493

原创 滚动页面,右侧小圆点样式跟随(类似轮播效果)基于jquery

这样页面滚动时小圆点就能跟随啦,点击小圆点也能定位到对应的版块。html部分:(贴图)

2019-11-25 16:12:39 836 1

原创 electron将vue项目打包成exe桌面应用流程及可能出现的问题

近期项目需求,把网页(基于vue)打包成exe桌面应用,在网上找到了electron;这里说说我对electron-builder的使用心得electron打包exe程序主要有两种方法:1、electron-packager:初学者入门demo传送门2、electron-builder:稍微复杂一丢丢,需要配置文件#######先将vue项目打包 npm run build 得到dis...

2019-11-13 17:49:16 2284 1

原创 vue路由history模式刷新页面一片空白,也不报错(解决方案)

如果项目不在根目录下,路由需添加配置(base)router/index.jsmode: 'history',base: '/h5/',config/index.jsbuildassetsPublicPath: '/h5/',后台配置代码:引用链接END....

2019-11-07 17:14:02 9282 1

原创 vue路由hash模式(带#)微信公众号首次授权后ios总是跳首页的问题

ios系统url上#后面的信息不会解析,会被忽略掉比如url:www.demo.com/dist/index.html#/detail?id=10直解析到www.demo.com/dist/index.html,所以跳转到首页解决方案:在index页面添加如下代码 beforeCreate() { window.location.href = window.locat...

2019-11-07 17:03:07 2294

原创 vue项目pc端使用flexible适配,字体显小问题

安装 npm i lib-flexible -S安装 npm i px2rem-loader -D在main.js引入 import ‘lib-flexible’build/utils.js修改配置//utils.jsconst cssLoader = { loader: 'css-loader', options: { sourceMap: options.sour...

2019-10-22 17:41:03 2466 2

原创 微信小程序request请求封装,并可设置防抖

请求函数加入防抖功能:有两种防抖效果,根据自己需求使用。页面中使用函数:先在app.js引用,方便调用。request请求封装基于promise。看下防抖效果(上图)

2019-10-17 11:00:32 935 1

原创 vue项目自定义滚动指令控制按钮显示隐藏

在vue项目中,有些页面需要toTop的按钮(滚到顶部),因此在页面中需要用到滚动事件,但是如果很多页面都需要用到这个按钮,就要在这些页面中都加上滚动事件,会导致页面代码臃肿,不便维护。这里使用vue自定义指令封装一个全局的滚动事件,在需要的页面引用组件,加上指令即可。下面上代码:1、首先封装一个toTop的按钮组件(默认显示)<template> <div id...

2019-09-05 14:10:12 1925 1

原创 Vue使用有赞ImagePreview(图片预览)遇到的问题

首先说下有赞ImagePreview的使用有赞官方文档:https://youzan.github.io/vant/#/zh-CN/image-preview先上个预览效果图问题点:如果图片预览弹框没有隐藏的话,在路由切换的时候也会一直显示如图,路由已切换:解决方案:beforeRouteLeave 钩子中调用 close() 方法关闭预览遮罩beforeRouteLeave ...

2019-08-22 09:23:05 19374 9

原创 Vue定时器报“timeout.close is not a function”的问题

今天在项目中用到定时器,发现个问题当vue清除定时器时发现报错解决方案:加上window前缀无报错信息

2019-08-21 09:04:16 1573

原创 vue搭建的公众号微信分享功能

微信分享,这里要注意的是,获取签名参数时,前端传的URL是#前面部分,所以要截取一下,否则即使能分享,分享的信息也是默认的,不能修改成传过来的标题和其他想要修改的数据import request from '../request/http'import Vue from 'vue'import { Toast} from 'vant'Vue.use(Toast)import api...

2019-08-14 09:11:50 1498 7

原创 vue-cli公众号调用微信支付(坑)

id=1(栗子)的形式,而正常的url是https://so.csdn.net/so/search/s.do?通过调试,仔细观察发现,vue的每一个路由访问,路由路径都是index.html#/后面发生路由变化,所以index.html#/就相当于是路由的一级目录,当配置成http://xxx.xxx.com/dist/调用支付,它会认为这不是根目录,怎么解决这个问题?配置url的时候,加上index.html#/:http://xxx.xxx.com/dist/index.html#/

2019-08-13 13:26:04 1842 1

自定义相机控件,可拍照、扫码,扫码成功带提示音

在小程序开发中,有很多场景需要用到拍照、扫码等 功能,但是小程序提供的API样式受限制,在某些场景下对用户的使用体验不够友好; 这个自定义相机控件能在一定程度上改善用户的使用体验; 此控件处理好了微信系统权限校验、小程序权限校验,带扫码成功音效,开箱即用;也可基于现有逻辑二开

2023-08-20

Vue ~ element-ui 动态表单验证,支持添加和删除操作

Vue 基于element-ui 组件,el-form与el-table结合使用实现动态表单验证,支持添加和删除操作;支持身份证号码验证、手机号验证; 开箱即用,方便快速二开,节省开发成本

2023-07-27

uniapp蓝牙硬件广播扫描

1. 初始化蓝牙适配器 2. 开始搜索设备 3. 发现外围设备 4. 获取所有已发现的蓝牙设备 5. 判断当前设备 6. 解析蓝牙设备的广播数据段中的 ManufacturerData 数据段

2022-10-26

实现蓝牙硬件广播扫描:uniapp

1. 初始化蓝牙适配器 2. 开始搜索设备 3. 发现外围设备 4. 获取所有已发现的蓝牙设备 5. 判断当前设备 6. 解析蓝牙设备的广播数据段中的 ManufacturerData 数据段

2022-10-26

Vue + Element-ui Dialog组件可多拽

Vue自定义指令实现Vue + Element-ui Dialog组件可多拽

2022-10-25

实现组件可多拽功能:Vue + Element-ui Dialog

Vue自定义指令实现Vue + Element-ui Dialog组件可多拽

2022-10-25

Vue3.0前端框架→开箱即用.zip

Vue3.0 项目搭建,开箱即用 Vue-router + Vuex + axios + eslint + element + less 框架包含:常用css类、js公用函数、本地缓存操作、常用正则表达式

2021-06-11

空空如也

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

TA关注的人

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