自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(29)
  • 收藏
  • 关注

原创 uniapp 自定义导航栏增加首页按钮,仿微信小程序操作胶囊

实现效果如图。

2024-12-03 11:36:22 685

原创 获取指定月份的下一个月的第一天和最后一天

getDateNew(year,month) {//获取每个月的最后一天//获取年份//获取月份//需要获取此月最后一天的日期//0-11,下一个月//设置当前日期为下个月的1号//1-31//下个月一号对应毫秒//下个月一号减去一天,正好是这个月最后一天},

2024-12-02 17:59:22 268

原创 判断接口是否在白名单的方法

判断接口是否在白名单的方法

2024-07-02 16:16:18 169

原创 【uniapp(微信小程序端) + vue3 + echart+HBuilderX】动态生成多个图表,并附带折叠功能

点击展开,展示该下面的图表展开其他模块,互不影响。

2024-07-02 16:10:42 785

原创 Vue图片预览组件

HTML部分<div class="img-view-wrapper" ref="imgWrapper" style="min-height:300px;"> <i class="el-icon-arrow-left imgIcon pre" :class="{ 'disable': index === 0 }" @click="goPrev()"></i> <i class="el-icon-arrow-right

2021-11-16 17:12:38 2361

原创 Vue 上传组件

HTML部分<div class="img-file-row"> <div style="flex:1;"> <div><div class="img-handel"> <el-button type="primary" name="onRemove" @click="onRemove()" v-show="isEditing">删除</el-butt

2021-11-16 17:08:38 1420

原创 vue 页面导航组件

快速到达指定的面板。当页面内容太多时,可以用此组件效果图html部分<div class="float-nemu-wrapper"> <span class="el-icon-arrow-left" v-if="!show" @mouseover="more" style="width:30px;height:30px;line-height:30px;background:#7a6e6e;border-radius:2px;color:#fff;vertical-align

2021-11-15 14:14:44 1303

原创 js 金钱格式化(money)

* value,金额* thou,是否加分号*len 小数数位 Vue.filter('money', function (value, thou, len) { if (value === 'undefined' || value === '' || value == null) { return ''; } if (value < 0) { return '-' + (Vue.tpUtil.

2021-11-12 15:28:09 1351

原创 js 正则

PATTERN_AMOUNT: /^(-)?(([1-9][0-9]{0,2}(,\d{3})*)|0)(\.\d{2})?$/, // 金额(千分位且2位小数)PATTERN_WEIGHT: /^(-)?(([1-9][0-9]{0,2}(,\d{3})*)|0)(\.\d{3})?$/, // 重量(千分位且3位小数)PATTERN_POSITIVE_INTEGER: /^[1-9]\d*$/, // 正整数PATTERN_INTEGER: /^-?\d+$/, // 整数PATTERN_DEC

2021-11-12 15:11:37 253

原创 js 封装一些时间常用的方法,如计算一年前的今天,比较两日期大小,字符转日期,时间加减,相差月数

相差月数/** * 相差月数 * @param s_time 开始时间 * @param e_time 结束时间 * @param type String 月数加减 1:加;2:减 * @param num int 月数 */ getMonthsApart: function (s_time, e_time, type, num) { var _this =

2021-11-12 14:49:34 402

原创 js 常用方法,首字母置为大写,克隆,数组转对象,比较对象

首字母置为大写replaceToUpperCase: function (str) { // 首字母置为大写 var reg = /\b(\w)|\s(\w)/g; // \b判断边界\s判断空格 return str.replace(reg, function (m) { return m.toUpperCase() }); },示例代码:var test = ‘abc’;v

2021-11-12 13:51:18 386

原创 vue 导入excle,可以预览

导入exclel,数据转成json,可以预览html部分<div> <div> <el-button :disabled="isReadonly" size="mini" type="primary" @click="onImport()">{{ _btnName }}</el-button> <el-button :disabled="isReadonly" v-show="preview&&i

2021-11-12 11:06:55 424

原创 vue 事件修饰符

在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在 events中轻松实现这点,但更好的方式是:methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节。为了解决这个问题,Vue.js 为 v-on(@)提供了事件修饰符。通过由点 (.) 表示的指令后缀来调用修饰符。.stop.prevent.capture.self.once...

2021-11-12 09:48:19 81

原创 jquery 穿梭框,可上下左右,全选移动

HTML部分<table align="center" cellpadding="0" cellspacing="0"> <tr> <td> 可选择表项 </td> <td></td> <td> 已选择表项 </td> </tr> <tr> <td> <select mult

2021-11-11 17:59:38 653

原创 Vue 自定义指令,保留两位位小数的正数

html 部分<el-input v-enterNumberPoint3> </el-input> js部分Vue.directive('enterNumberPoint3', { inserted: function (el, binding) { var trigger = function (el, type) { var e = document.createEvent(

2021-11-10 16:19:01 619

原创 vue 控制多个固定不同类型的数字输入框的输入值相加百分比不超过一百(用于计算费率)

v为输入框的值,type为输入框的 idaddressChange: function (v, type) { var _this = this; v = v.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3').replace(

2021-11-10 16:07:51 2352

原创 h5双击事件失效,模拟双击事件

vue的h5项目,给一元素绑定双击事件dblclick,双击事件dblclick无效不触发解决办法:模拟双击事件dbTest(){ // 全局声明verClickNum = 1, clickTimer = null, lastClickTime = 0; var nowTime = new Date().getTime(); if (nowTime - this.lastClickTime < 300) { /*双击*/

2020-10-30 19:52:55 2146 1

原创 vue.js 封装公用的导出表格方法

//自己内部封装的axios 正常的配置即可import axios from '@/utils/axiosConfig';import { Message } from 'element-ui';/** * * @param {请求路径,请求参数,表格名称,导出的条数} obj */function fileDownLoad(obj) { axios.post( obj.url, obj.param, {responseType: "blob"} ).then(re

2020-09-27 17:07:25 487

原创 react 动态切换轮播图卡片

通过换一组切换卡片,也可以滑动卡片切换,效果如图⬆️import { Carousel, Card } from 'antd-mobile';import { inject, observer } from 'mobx-react';interface Props { configStore: ConfigStore;}@inject('configStore')@observerexport default class HomePage extends React.Component{.

2020-09-02 11:38:21 1609

原创 react canvas的三角形结合antd-mobile的滑动输入条,实现动态控制三角形的大小

效果如上图⬆️import { Slider } from 'antd-mobile';import { inject, observer } from 'mobx-react';//当前屏幕宽度const screenWidth = window.screen.width;@inject('configStore')@observerexport default class HomePage extends React.Component { //初始化三角形 async comp.

2020-09-01 17:17:29 342

原创 css 原生input框带单位

效果如⬆️HTML部分const prefixCls = 'issues-detail';<div className={`${prefixCls}-box}`}> <input className={`${prefixCls}-input}`} /> <span className={`${prefixCls}-month`}>个月</span></div>CSS部分$prefixCls: 'issues-detail';..

2020-08-31 14:29:09 925

原创 CSS3 媒体查询,根据屏幕screen大小调节样式显示

CSS3 媒体查询方法的使用常用的几个手机尺寸,便于copy,哈哈哈~????5/SE@media screen and (min-width: 320px) and (max-width: 568px) { }????6/7/8@media screen and (min-width: 375px) and (max-width: 667px) { }????6/7/8 plus@media screen and (min-width: 414px) and (max-width: 73

2020-08-28 18:07:33 1014

原创 react 移动端H5 页面 input 获取焦点不灵敏

开发中遇到ios中input获取焦点,需要一定的点击时长,经常无法一次成功获取焦点。解决方法:在input控件外面包裹一层div,然后 在div上添加点击事件,为input手动获取焦点。//tsx写法,先定义HTMLInputElement[] = [];1. private phoneInputs: 2. <div onClick={() => this.inputClicked(index)}> <input placeholder={item.text}

2020-08-28 12:16:29 778

原创 js设置html根节点的style字体

> 由于设备的长宽尺寸不同,和用户查看模式(横向/竖向)的切换,页面需要进行相应的调整。> orientationchange 事件是在用户水平或者垂直翻转设备(即方向发生变化)时触发的事件。> window.orientation可以检测当前设备处于何种查看模式。> window.orientation具有三个返回值:(1)0:表示竖屏模式(portrait)(2)-90:设备横向旋转到右侧的横屏模式(landscape)(3)90:设备横向旋转到左侧的横屏模式(lan

2020-08-18 15:49:46 1290

原创 js常见的数据转换格式处理

整理一些常用的js对数据的处理方法 (不定时更新。。。。)年月日function timestampToTime(time) { var timestamp = (new Date(time)).getTime(); var date = new Date(timestamp );//时间戳为10位需*1000,时间戳为13位的话不需乘1000 var Y = date.getFullYear() + '年'; var M = (date.getMonth()+1 <

2020-08-13 11:54:45 405

原创 js常见的表单验证方法

整理一些常用的js校验 (不定时更新。。。。)短信验证码(6位纯数字)isVerificationCodeValid = (verificationCodeValid) => { const code = /^[0-9]{6}$/; return code.test(verificationCodeValid);};登录密码(8-16位数字和字母组合)isPasswordValid = (password) => { const pwd = /^(?![0-9]+$)(

2020-08-13 11:07:24 303

原创 js实现姓名,手机号,身份证号,邮箱脱敏处理

手机号脱敏处理需要对手机号保留前三位和最后四位,中间对用*处理如18912341234脱敏处理之后应该变成189****1234。处理方法如下:encryptPhone(str) { if (null != str && str != undefined) { var pat = /(\d{3})\d*(\d{4})/; return str.replace(pat, '$1****$2'); } else { return "";

2020-08-13 10:43:49 6722

原创 基于vue的h5 拖拽组件( 吸边处理)

(1)自定义一个公共组件drag.vue<template> <div class="ball-page" ref="default_drag_comp" @click="goNext" @touchstart="down" @touchmove="move" @touchend="end" > <img :src="ball.icon" class="icon" /> <div class=

2020-06-16 15:29:49 1823 1

原创 使用element-ui 树形table 实现特定的手风琴效果以及增删改查功能

使用element-ui 树形table 实现特定的手风琴效果以及增删改查功能每次只能展开同级一行的手风琴效果查询表格,高亮当前节点并展开当前节点的所有父节点,合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入基于Element-UI的树形表

2020-06-12 10:33:57 2237 1

空空如也

空空如也

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

TA关注的人

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