- 博客(49)
- 资源 (2)
- 收藏
- 关注
原创 小程序展示base64图片
base64图片如果不包含类似于【data:image/png;base64,】,这个字符串。let base64Img = 'base64字符串'base64Img = 'data:image/png;base64,' + base64Img ;如果包含【data:image/png;base64,】。 <image mode="widthFix" src="{{base64Img}}" />如果上面base64字符串没有问题,需要去一下字符串里面的空格。base.
2021-12-08 16:36:04
1610
原创 mPaaS小程序一些记录
mpaas 小程序介绍mPaaS 小程序,源自于支付宝小程序框架,继承了支付宝小程序框架的易开发性、跨平台性以及 Native 性能,不仅帮助开发者实现面向自有 App 投放小程序,还可快速构建打包,覆盖支付宝、淘宝、钉钉等应用。基于 mPaaS 小程序,开发者能够快速优化发布包大小,节省流量和存储。同时,服务迭代不再受发版限制,快速发布,快速迭代。甚至,基于统一的开发标准,小程序仅需开发一次,便可快速投放至多端开发1、使用支付宝小程序开发工具,选择mpaas小程序。2、前端开发还是.
2021-11-26 15:40:00
1368
原创 vue2 antdesign menu 渲染多级菜单
示例数据//path 自行配置const menu = [ { title: '示例1', icon: 'laptop', path: '', children: [ { title: '示例1-1', icon: 'laptop', path: '' }, { title: '示例1-2', icon: 'laptop', path.
2021-11-04 17:51:59
1822
原创 mPaaS小程序使用国密算法sm2加密传参
使用 miniprogram-sm-crypto使用文档npm i miniprogram-sm-crypto引入const sm2 = require(‘miniprogram-sm-crypto’).sm2;在js文件里const sm2 = require('miniprogram-sm-crypto').sm2;const smTwo = { sm2, cipherMode: 1, // 1 - C1C3C2,0 - C1C2C3,默认为1 sm2p.
2021-11-04 17:06:55
986
转载 antdesign-vue table合并列
合并的方法const temp = {};const mergeCells = (text, array, columns) => { let rowSpan = 0 if (array.length == 1) { rowSpan = 1 } else { if (text !== temp[columns]) { temp[columns] = text array.forEach((i.
2021-10-21 20:41:20
797
原创 vue2 elementui日期时间选择器
设置日期选择器(范围)只能选择当前月份的日期<el-date-picker v-model="search.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" style="width: 210px" :clearable="false" :picker-options="pickerOptions.
2021-07-29 11:54:58
1242
原创 vue仿elementui自定义一个v-pageloading指令,开箱即用
创建一个loading文件夹。包含loading.vue、loading.js、index.jsloading.vue 写布局及css样式实例代码<template> <div class="loading-container" v-show="loadingShow"> <div class="pageloading"> <span></span> <span.
2021-01-14 16:35:07
471
原创 前端组件拖拽以及自定义组件布局demo(基于vue2实现)
这篇文章简单介绍前端(vue)里组件拖拽以及拖拽完成以后组件自定义排列的的写法。主要介绍思路以及实现方式(会一直更新这个功能,直到我自己把它做完善)。组件的放大缩小以及拖拽借助一个不错的插件vue-grid-layoutgit文档:https://github.com/jbaysolutions/vue-grid-layout/blob/master/README-zh_CN.md这个插件定义的某一个元素的宽高是利用倍数计算宽高以及位置,在使用的时候可以自己先去定义一个栅格的背景,我做的是.
2020-12-16 18:50:39
21303
24
原创 js控制台输出永无bug(在写代码的路上居然信开了玄学)
在写代码的路上居然信开了玄学!!!!!!!!!!!!!似乎真的有用?????????????function noBug() { const nostr = " ......................阿弥陀佛......................\n" + " _oo0oo_ \n" + " o888888.
2020-12-10 15:43:17
466
原创 javascript中的prototype、call、apply、bind
js中继承有几种方式,下面介绍4种,分别是prototype、call、apply、bind一、prototype(原型)//通过将父对象的构造函数的实例放在子对象的原型中,实现继承。//原型继承 function person(name,age,sex,job){ this.name=name; this.age=age; this.sex=sex; this.job=job; } person.protot.
2020-12-04 14:24:42
463
原创 记一次前后端分离项目get方式向后台传参数,类型为数组。如何处理?
前端向服务端传参时使用get方式,传递的是一个拼接好的字符串,在一般项目中,很少会出现其中某一个参数是数组的情况。一般是,例www.baidu.com?type=3&id=2在做前后端分离的项目时,可能后端需要前端使用get方式传递数组,例www.baidu.com?types=3&tag=[{“id”:“step”,“type”:“1”},{“id”:“orde”:“type”:“2”}]当时我在给后端传的时候,就简单的使用了JSON.stringify(Arr.
2020-12-04 11:40:03
1226
原创 uniapp编译微信小程序与app使用高德地图api定位(百度地图同理)
1.去高德地图创建自己的应用2.填写ios、Android平台和小程序的key(自定义)、Android平台的发布版安全码SHA1,如果没有可以填hbuliderx的公共测试证书里的。ios需要填安全码Bundle ID(打包的包名)3.不管是app端还是小程序都可以使用高德提供的微信小程序的SDK4.微信小程序的key需要写在代码里5.app端key6.使用//map.jsimport amap from './js-map-sdk/amap-wx.js';..
2020-10-24 17:34:55
2361
1
原创 前端js省市下拉框,及静态数据包
前端js省市下拉框,及静态数据包目前使用vue实现、可以在原生js使用。部分js//筛选市cityFilter(arr,key){ let citys = []; for(let i=0,len=arr.length;i<len;i++){ for(let j=0,jen=arr[i].length;j<jen;j++){ if(key == arr[i][j].value.substring(0,2)){ citys.push(arr[i][j]); .
2020-10-24 13:18:30
505
原创 js判断是否是ie浏览器,弹出提示使用别的浏览器打开
判断是否是ie浏览器,弹出提示使用别的浏览器打开<script type="text/javascript"> (function(window){ var userAgent = navigator.userAgent; var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; var isIE11 = userAgent.i.
2020-10-23 13:25:47
1198
原创 Vue实现pc/移动端图片预览、放大、缩小、旋转的效果
实现pc/移动端图片预览、放大、缩小、旋转的效果git => https://github.com/mirari/v-viewer使用1.npm install v-viewer2.在全局引入或局部引入全局引入`import ‘viewerjs/dist/viewer.css’;import ‘…/static/css/defaultstyle.css’;`Vue.use(Viewer);<viewer :images="images"> <i.
2020-10-22 14:05:43
1739
原创 javascript通过银行卡号识别所属银行
function bankCardAttribution(bankCard){ var cardTypeMap = { DC: "储蓄卡", CC: "信用卡", SCC: "准贷记卡", PC: "预付费卡" }; function extend(target, source) { var result = {}; var key; target = target || {}; source = source || {};
2020-09-28 09:29:25
1998
原创 js工具类函数
//秒转换时分秒second2String(sec){ var hours = Math.floor(sec/ 3600) var minutes = Math.floor(sec % 3600 / 60) var seconds = Math.floor(sec % 3600 % 60) var hourStr = String(hours) var minStr = String(minutes) var secStr = String(seco
2020-09-24 17:49:05
212
原创 使用uniapp编译多端,自定义导航栏高度、状态栏的高度
使用uniapp框架编译多端,在使用自定义导航栏的时候需要适配不同手机,在安卓和ios上手机的状态栏高度是不一样的,尤其是小程序。uni.getSystemInfo();//在小程序上使用这个方法去获取,应为iphonex的高度和其他型号的高度不一样。uni.getSystemInfo({ success: (data) => { data.statusBarHeight => 手机状态栏高度 data.statusBarHeight + 44 => ios手机状态栏+.
2020-09-01 16:51:18
1601
1
原创 去除字符串中的表情符号以及判断字符串中是否存在表情符号
去除字符串中的表情符号function isEmojiCharacter(str) { let reg = /\uD83C\uDFF4\uDB40\uDC67\uDB40\uDC62(?:\uDB40\uDC65\uDB40\uDC6E\uDB40\uDC67|\uDB40\uDC73\uDB40\uDC63\uDB40\uDC74|\uDB40\uDC77\uDB40\uDC6C\uDB40\uDC73)\uDB40\uDC7F|\uD83D\uDC68(?:\uD83C\uDFFC\u2.
2020-08-29 09:26:37
15770
原创 js 渲染树形结构
js渲染树形结构1.数据格式,例:[ { "title":"第一章人人都想用", "child":[ { "title":"1、云开发简介", "child":[ { "title":"1.1.1 详情", "child":[ { "title":"1.1.1.1 详情-1" } ] } ] }, {"title":"2、云开发简介"} ].
2020-07-11 09:07:54
1866
1
原创 前端(vue)实现图形(拼图等)验证码
一、第一种vue移动端(PC端)图形验证码vue2-verify前往地址常规验证码picture 常规的验证码由数字和字母构成,用户输入不区分大小写,可变形成汉字验证。运算验证码compute 运算验证码主要通过给出数字的加减乘运算,填写运算结果进行验证。滑动验证码slide 通过简单的滑动即可完成验证,应用与移动端体验很好。拼图验证码puzzle 拼图。选字验证码pick 通过按顺序点选图中的汉字完成验证,ie浏览器要求9或以上。<Verify @success="onSuc
2020-07-03 14:33:55
2752
原创 js本地存储设置有效时长
js本地缓存设置有效时间以下举例为小程序(浏览器、vue、uniapp等都适用)如需在其他环境下使用,对代码稍加修改就好。changetime(){ let nowtime = Date.parse(new Date()); //当前时间 let c_time = wx.getStorageSync('time'); //获取第一次存下的时间 let Cachetime = c_time + 450000000; //设置缓存时间 let data_Cachetim.
2020-06-29 15:45:16
2575
原创 根据字符的首字母进行分类
列举定位索引列表//假如初始数据格式[ { desc1: "北京市" detailno: "110100" detailsort: "110000" diccode: "QBSYS10050" } .....]需要用到var phoneticTranscriptionObj = { "a": "\u554a\u963f\u9515", "ai": "\u57c3\u6328\u54ce\u5509\u54c0\u7691\u764c\u853c\u77ee.
2020-06-29 09:09:36
9878
原创 前端(移动端)图形验证码
微信小程序、uniapp、h5、vue等(利用canvas实现)1.例子(展示小程序):1.如果不是小程序的话,适当修改一下代码2.新建mcaptcha.js文件module.exports = class Mcaptcha { constructor(options) { this.options = options; this.fontSize = options.height * 3 / 6; this.init(); this.refresh(); } i.
2020-06-18 12:44:57
1439
原创 css :nth-child(n)
1、nth-child(2n)这个表示选择列表中的偶数标签,即选择 第2、第4、第6…… 标签。2、nth-child(2n-1)这个表示选择列表中的奇数标签,即选择 第1、第3、第5、第7……标签。3、nth-child(n+3)这个表示选择列表中的标签从第3个开始到最后。4、nth-child(-n+3)这个表示选择列表中的标签从0到3,即小于3的标签。5、nth-last-child(3)这个表示选择列表中的倒数第3个标签。6、nth-last-child(-n+3)这
2020-05-20 16:25:40
734
原创 css object-position/object-fit
自己在项目里使用过,这里不过多的总结,解释详细示例,解释。移步张鑫旭博客 https://www.zhangxinxu.com/wordpress/2015/03/css3-object-position-object-fit/object-fit//值.fill { object-fit: fill; }.contain { object-fit: contain; }.cover { object-fit: cover; }.none { object-fit: none; }.s.
2020-05-20 14:52:12
172
原创 html实现文字滚动效果
marquee标签<marquee></marquee>//例<marquee align="left" behavior="scroll" bgcolor="#FF0000" direction="up" height="300" width="200" hspace="50" vspace="20" loop="-1" scrollamount="10" scrolldelay="100" onMouseOut="this.start()" onMouseOve.
2020-05-20 14:24:45
5038
原创 javaScript对象的一些属性或方法
一·Array对象数组对象有一些我们常用的属性或方法1.属性1.length:数组的长度,用来表示数组的个数2.constructor:保存构造函数2.方法arr.push(元素)1.往数组的末尾添加一个或多个元素2.返回值是修改后的数组长度3.会修改原数组arr.unshift(元素)1.往数组得开头添加一个或多个元素2.返回值是修改后的数组长度3.会修改原数组arr.pop(元素)1.从数组的末尾删除一个元素2.返回值是被删除的元素3.会修
2020-05-19 09:48:42
286
原创 js常用的正则匹配(一般不用修改)
https://www.jianshu.com/p/340380a93ffe匹配中文字符的正则表达式: [\u4e00-\u9fa5] 匹配双字节字符(包括汉字在内):[^\x00-\xff] 匹配空行的正则表达式:\n[\s| ]*\r 匹配 HTML 标记的正则表达式:<(.*)>.*<\/\1>|<(.*) \/>匹配首尾空格的正则表达式:(^\s*)|(\s*$) 匹配 IP 地址的正则表达式:/(\d+)\.(\d+)\.(\d+)\.(\d+).
2020-05-18 14:55:48
985
1
原创 Es6扩展运算符(...)的使用
对象中的扩展运算符(…)用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中let bar = { a: 1, b: 2 };let baz = { ...bar }; // { a: 1, b: 2 }//上述方法实际上等价于:let bar = { a: 1, b: 2 };let baz = Object.assign({}, bar); // { a: 1, b: 2 } //如果用户自定义的属性,放在扩展运算符后面,则扩展运算符内部的同名属性会被覆盖掉。let bar = .
2020-05-18 14:17:58
382
原创 利用css把整个项目覆盖蒙版,变为灰色。
html{ -webkit-filter:grayscale(100%); -moz-filter:grayscale(100%); -ms-filter:grayscale(100%); -o-filter:grayscale(100%); filter:grayscale(100%); filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'>&l
2020-05-18 14:09:48
2119
原创 js-时间函数中回调取值
function abs(fun){ let num = 100; let time = setInterval(()=>{ num -- ; fun.call(this,num) //fun.apply(this,[num]) fun.bind(this,num)() fun(num) if(num == 50){ clearInterval(time); .
2020-05-15 15:34:33
198
原创 js-操作Array、String、Object其中的一些方法
f访问:通常通过 obj.attr 或者obj[‘attr’] 来访问属性,但是如果属性名称为关键字或者保留字的时候,要通过 obj[‘attr’] 访问,所以要注意变量的命名,尽量不要用关键字和保留字。5.Object.assign(target, …将所有可枚举属性的值从一个或多个源对象复制到目标对象。5.Object.create() ES5新增方法。1.字面量的方式创建。
2020-05-15 15:32:07
311
原创 js获取当前时间、计算时间差、倒计时
获取当前时间getDate(){ var myDate = new Date(); var year = myDate.getFullYear(); var month = myDate.getMonth() + 1; var month1 = month >= 10? month : '0'+month; var date = myDate.getDate(); var date1 = date >= 10? date : '0'+date; var h = myDate..
2020-05-13 15:46:21
1608
原创 vue(h5+app分享微信、朋友圈、保存图片)
h5+api(调用手机的一些功能) http://www.html5plus.org/doc/zh_cn/android.html分享海报(image) shareWx(scene) { //scene=> 'WXSceneTimeline'(朋友圈)、'WXSceneSession'(微信)、pic=>图片地址 let pic = this.pic_img let msg = { type: "image", p.
2020-05-13 11:25:28
5075
3
原创 前端rem适配
原生或jquery写一些简单的下载页面、展示页面等…new function() { var _self = this; _self.width = 640; // 设置默认最大宽度 _self.fontSize = 100; // 默认字体大小 _self.widthProportion = function() { var p = (document.body && document.body.clientWidth || document..
2020-05-13 10:48:11
548
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人