- 博客(47)
- 收藏
- 关注
原创 WBXprogress组件更加完善版
优化了滑动的方式的计算,兼容了默认滑块及自定义滑块,相对于上个版本都新增了啥,我也忘了,反正就比上一个自由度更高就对了。
2024-09-26 16:07:43
460
原创 手写WBXslider 组件 (标签为微博小程序,需要改成对应的标签,或方法)
视频进度条组件,自定义的,需要将标签改为需要的格式,本文章基于微博小程序
2024-09-23 14:56:18
414
原创 微信小程序,数据缓存,单个 key 允许存储的最大数据长度为 1MB 存的数据大于1M处理方法
将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。除非用户主动删除或因存储空间原因被系统清理,否则数据都一直可用。单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB。注意如果数据要是可能大于10M,可以用全局变量。1.将数据分块存入缓存中。下面时再其他页面应用。
2024-04-25 16:48:44
945
原创 uni app请求封装,超简单,直接复制就行
/ 此vm参数为页面的实例,可以通过它引用vuex中的变量。在main中引入 放在app.$mount()上面。在创建config/api.js 用于集中管理。/* config 为默认全局配置*/// 初始化请求配置。在发请求的页面这样写。
2024-03-21 18:09:27
575
1
原创 uni-app 上传头像
//main.jsVue.prototype.$imageUrl ="http://www.com/baidu.com" //上传图片地址 uploadImg() { uni.chooseImage({ count: 1, //默认9 sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有 sourceType: ['album', 'camera'], //从相册选择和拍照 success: res =>
2022-03-23 17:47:25
272
原创 保存二维码至手机(海报)
// html <view @click="downloadPic">保存二维码</view> <view style="position: absolute; top: 0; left: 0; z-index: -1;"> // 设置canvasid <canvas style="width: 670rpx; height: 1070rpx;" canvas-id="firstCanvas" id="firstCanvas"></canva
2022-03-23 16:31:40
217
原创 uni app 常用工具函数 验证手机号
// untils/untils.js // 1. 验证手机号function checkPhone(phone) { let myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/; if (!myreg.test(phone)) { return false; } else { return true; }}// 暴漏出去module.exports = { checkPhone}// 使用// 引入<script> import
2022-03-10 14:24:52
443
原创 pc banner图 自适应 图片不变型
/* banner照片 */.banner_box{ min-width: 1200px; height: 600px; background: url(../image/product/banner.png); background-repeat: no-repeat; background-position: center; background-size: cover;}<div class="banner_box"></div>
2022-03-08 16:44:11
322
原创 pc端清除默认样式
/* 清除内外边距 */body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,a,b,span,p,i,dl,dt,dd,ul,ol,li,pre,button,input,textarea,th,td,div,select,img {margin: 0;padding: 0;}img {max-width: 100%;height: auto;box-sizing: border-box;border: 0
2022-03-08 16:39:25
328
原创 利用URLSearchParams,判断
{path: “/”,redirect:new URLSearchParams(window.location.search).get(“role”) === “com”? “/training-manage/manage-workbench”: “/safety-training/training-execution-tracking”,},
2021-12-29 10:03:43
215
原创 axios 请求方式
// delete携带请求体参数 配置对象export const reqRemoveUsers = idList => { return request.delete(`${api_name}/batchRemove`, {data:idList});};axios.request(config)axios.get(url[, config])axios.delete(url[, config])axios.head(url[, config])axios.options(ur
2021-11-10 00:05:56
228
原创 递归调用 封装一个函数
// 数据格式children: { children: [ { id: "1" level: 1 name: "二级数组" select: true children:[] } ] id: "1" level: 1 name: "全部数据" select: true} // 一个递归函数为了遍历children data 是所有数据 arr要存储东西的容器 foreachChildren(data,checkedArr){
2021-11-09 17:10:40
211
原创 简单过滤器
// main.js // 过滤器 format_price为名字 用只需在最后 | +名字Vue.filter('format_price', (val) => { return '¥' + Number(val) + '元';});// 使用 <div class="price">{{im.price | format_price}}</div>
2021-11-05 22:57:43
70
原创 flex布局 css封装
在公共文件中引入 @import './flex'; 前提是必须安装预编译 <style lang="less">div{ box-sizing: border-box;}.jtl{ width: 20px; height: 15px; }.pic{ width: 100%; height: 100%;}/* 弹性布局 */.flex { display: -webkit-box; display: -moz-box; display.
2021-11-05 18:34:07
496
原创 vue+vant 移动端适配
将如下代码放入app.vue样式中 ,以后用单位rem 1rem =100px// app.vue<style>html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike.
2021-11-05 18:08:00
194
原创 路由懒加载 及封装
// 文件 index.js import Vue from 'vue'import VueRouter from 'vue-router'import routes from './routes'import store from '@/store'//应用插件Vue.use(VueRouter)//将VueRouter.prototype的push和replace存储一份const originPush = VueRouter.prototype.pushconst ori...
2021-11-04 00:20:03
177
原创 axios拦截器 封装 及 模块化
axiox 封装 // 文件: api.js/* 该文件是对axios的二次封装,目的:让整个项目发送ajax请求时,通用的配置不用一遍一遍重复编写了*/import axios from 'axios'//引入NProgress做进度条import NProgress from 'nprogress'//引入NProgress的样式import 'nprogress/nprogress.css'import store from '@/store'import {Message.
2021-11-04 00:10:54
154
原创 小技巧 快速修改某个数组中一个或者多个对象的属性名
快速修改某个数组中一个或者多个对象的属性名ring先进行深拷贝,在替换JSON.parse(JSON.stringify(data).replace(/name1/g,"new_name1").replace(/name2/g,"new_name2"))data是数据, replace 可以重复链式编程,name1表示旧的属性名,new_name1表示新的属性名...
2021-11-03 20:58:52
340
原创 常用的数组方法及使用
// 1. includes()方法 // 用法: 用于判断数组里是否包含括号里的值 (可以为数字,字符串) // 返回值: 如果包含就返回true,反之false // const array = [1, 2, 3] // console.log(array.includes(2)) // 2.indexOf()方法 // 用法: 用于判断数组里是否有括号里的值 // 返回值: 如果包含就返回对应的下标,如果没有就返回-1 // const array = ['a','b','c'.
2021-11-02 17:03:51
292
原创 正则表达式
checkPhone() { //手机号正则 var phone = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/; //使用 if(!phone.test(mobile)) { console.log('手机号格式不正确'); return true; } //密码正则 var password =/^(?=.*\d)(?=.*[a-zA-Z])(?=.*[\W_]).{8,}
2021-11-01 16:19:13
67
原创 防抖 与节流
安装 npm i lodash 引入 import throttle from ‘lodash/throttle’ 原理就是在外面包一层防抖 : 多次变一次 throttle节流 : 一次变少次 // 数量加 addsum:throttle (async function (skuId) { await reqAddOrUpdateCart(skuId, +1) this.$store.dispatch('cart/getCartList') },10..
2021-10-30 10:26:45
85
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人