自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

onlylele的博客

在路上

  • 博客(110)
  • 资源 (11)
  • 收藏
  • 关注

原创 js递归给每项添加字段和值

通过js递归循环根据指定条件给数组中的每项数据新增字段和值;

2024-04-30 09:24:19 403

原创 vxe-grid\table 自定义动态列排序设置

实现动态加载的表格数据,根据设置动态控制指定的某些字段排序功能;

2023-08-10 17:09:22 2158

原创 a-tree 实现父级节点禁用,通过子级节点勾选状态控制

a-tree 组件实现折叠选择;使其父级节点禁用,通过子级节点的勾选状态来控制是否勾选;如果子级节点勾选任一个,父级节点就勾选中,如果子级节点全部不勾选则父节点不勾选,否则勾选,

2023-07-21 16:12:50 1687

原创 Js判断浏览器内核

js判断浏览器版本以及浏览器内核的方法。

2023-05-30 10:16:48 1339

原创 a-checkbox 全选状态监听设置

功能介绍,通过勾选全选状态,所以内容均勾选,取消全选则所有内容均取消勾选,且监听勾选状态,当全部勾选了,则全选状态自动被勾选,反之则自动被取消勾选;

2023-05-26 14:37:05 679

原创 vue数组渲染改变一个内容无法即时渲染问题

通过vue中v-for 渲染的内容,当点击指定的某一项改变后,使其不请求后端,不刷新页面视图而直接改变数据展示;

2023-05-18 10:12:26 389

原创 a-tree 实现右键点击添加操作项

通过右键点击菜单任务项可以显示对应的添加,编辑,删除等业务操作项的功能;

2023-05-12 11:12:46 957

原创 uniApp 取安卓软键盘高度及设置

当手机输入内容时会弹出系统默认的软件盘,此时可能导致其他整体的页面内容上移而覆盖到工具栏或者软件盘直接覆盖了底部的部分内容;

2023-05-12 10:51:52 1675

原创 vxe-grid 表格头标题设置及内容合并列项

vxe-grid 表格的高级使用: 自定义表格表头标题动态添加,内容列有合并项;

2023-04-27 10:21:25 2047

原创 vxe-table 右键菜单设置

vxe-table中点击右键出现右键菜单项,可以选择右键菜单中的内容

2023-04-24 17:21:50 1646

原创 uniApp内定时器自定义清楚方法

1、基础库配置在build.gradle中添加资源引用implementation fileTree(dir: 'libs', include: ['*.aar', '*.jar'], exclude: [])implementation "com.android.support:support-v4:28.0.0"implementation "com.android.support:appcompat-v7:28.0.0"implementation 'com.android.suppo

2021-06-30 17:37:41 1151

原创 vue 父子组件之间传递参数(provide/inject)

注意:provide和inject需要一起使用;示例代码如下:1. 父组件中:设置传递给子组件的内容;// 父组件provide() { return { message: (data) => { return new Promise((resolve, reject) => { this.handleClickOptions('message', data, this.$refs.info.getCurrentInfo..

2021-05-27 15:54:36 701

原创 搜索栏输入框输入后自动搜索功能

作用:顶部搜索栏搜索框填写完内容后让其自动搜索;代码如下; watch: { 'params.order_sn'(newVal,oldVal){ //添加空格不做处理 if(newVal.trim() == oldVal.trim()) return; // 输入框防抖 clearTimeout(this.debounceTimer); this.debounceTimer = setTimeout(()=&gt

2021-05-18 17:15:23 1849

原创 js 金额相关数据内容整除显示处理

需求:当金额数据大于10000时显示 'num万元' 否则显示 'num元';实现: filters: { totalMoney(totalM) { const floatMs = (totalM / 10000) % 1 === 0 ? (totalM / 10000) + '万元' : parseFloat(totalM / 10000).toFixed(2) + '万元' const floatMe = totalM % 1 === 0 ? (totalM +

2021-04-17 11:41:30 274

原创 el-checkbox-group多选框编辑时渲染显示,修改选择无效问题;

1、问题描述:使用elementui 中的多选框组件,编辑表单内容时可以正常显示,但是改变时一个选择无效,显示状态没有修改成功问题;如下图所示:2、使用说明:仅部分主要代码,markList 为被选项列表。 // 修改客户标签改变 , i handleRoleCheckedChange(m) { this.markList.forEach((itds, i) => { if (itds.wholesaler_mark_id === m.wholesal

2021-03-30 15:04:11 2605

原创 uview 中u-select选中时默认的选择状态聚焦

效果如下:使用u-select 时,默认选中的状态设置;设置实现:<view class="stork-shaixuan iconfont"> <view class="ware-select" @click="selectarea('salesman')"> {{ salesmantext || '选择业务员'}} </view> </view><!-- 选择器 --> <u-s

2021-03-27 15:37:49 4729 1

原创 elementUI 表格右侧固定布局错误问题

问题效果如下:解决:1,html 布局中添加:2. 页面中覆盖原样式代码:<style lang="scss" scoped> .table-fixed { /deep/ .el-table__fixed-right { height: 100% !important; //设置高优先,以覆盖内联样式 } /deep/ .el-table__fixed { height: 100% !important; //设置高优

2021-03-19 16:51:56 1329

原创 常用页面中上下无缝滚动效果

常用web页面中设置上下无限滚动效果;(左右滚动类同)代码如下: <div id="colee_left" class="news-right-cont" style="touch-action:none;height: 360px;overflow-y: hidden;"> <ul id="colee_left1">

2021-03-11 14:33:35 753

原创 web 文本打字动态效果

说明. 实现文本内容的打字输入的动态效果,代码实现如下:html:<div class="hcontainer text-center flex-center" id="HotNews"> 公司使命:服务国家战略、保障人民健康、引领行业发展/div>js效果实现:<script LANGUAGE="JavaScript"> var NewsTime = 2000; //每条新闻的停留时间 var TextTime = 50; .

2021-03-04 10:36:22 600 1

原创 web页面常用分页效果

1、分页效果如下:代码实现:<!-- 分页 --> <div id="pages" class="pb-50 mtb-25"> <div class="common"> <ul> <ul class="clearfix page-center"> <li><span class="rows">共 18 条记录</

2021-02-24 09:27:13 605

原创 Uni-app 云打包(安卓App)基本流程

1、manifest.json 配置 (app模块配置,权限配置 根据需要勾选即可)2、云打包说明:注意打包时需要有项目的管理权方可打包;配置完成后打包即可!

2021-01-31 11:07:10 3024

原创 Set 使用场景及分析

1、set使用数组去重,如下所示:// 例一const set = new Set([1, 2, 3, 4, 4]);[...set]// [1, 2, 3, 4]// 例二const items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);items.size // 5// 去除数组的重复成员[...new Set(array)]// 去除字符串里面的重复字符[...new Set('ababbc')].join('')// "abc"..

2020-10-29 16:21:35 1854

原创 Elementui cascader组件如何取消选中 clearCheckedNodes

问题在form表单中使用cascader,某些需求下会将整个表单disabled,如果此时点击了cascader,它会disabled,但弹出框不会消失。查看文档给cascader设置上ref<el-cascader v-model.trim ="cId" ref="cascader" :options="category" @change="handleChange"></el-cascader>调用 // 清空选中的节点 this.$ref

2020-10-12 14:30:39 5436 3

原创 Css3、Scss 常用的布局设置-通用

常见的几种css布局垂直居中// 第一种 绝对定位#parent{ position:relative; height:400px; .son{ position:absolute; width:100px; height:100px; top: 50%; transform: translateY(-50%); }}// 第二种 flex布局#parent{ display:flex; align-items:center; .

2020-10-08 16:39:25 862

原创 Element ui 设置默认时间显示

element ui 选择时间组件:需求:实现默认时间定位于当前时间延后7天的日期;且当前时间之前的日期不能选;html部分: <el-date-picker v-model="shopForm.end_time" type="datetime" size="medium" style="width:100%" .

2020-10-08 15:40:47 6000 1

转载 css3 图片阴影、翘边效果

CSS3实现曲线阴影和翘边阴影往往我们在做一些特殊的阴影效果的时候,使用图片做背景的方式实际上是很差劲的,在不考虑适配老版本浏览器的前提下,我们可以使用css3的自定义出自己想要的阴影风格。下面将以曲线阴影和翘边阴影为例,讲解自定义阴影的过程。先来看下效果图曲线阴影曲线阴影其实可以使用双层阴影重叠的方式实现我们将取消阴影的图片做下分解应该会更容易理解,示意图如下:如上图,图1基础的阴影下,在加一个有弧度的阴影即可。1、图1基础阴影很容易实现,内阴影+外阴影.box-shad

2020-10-07 10:51:05 535

原创 KeepAlive 简单使用,及手动去除内容存储

项目需求:使用keep-alive实现项目中部分页面的存储功能,当关闭页面需求清除掉缓存,tab切换页面时需要保留内容进行缓存;问题:关闭后,重新打开页面,内容仍然存在,需要强制清除keep-alive保留的缓存内容;效果如下:实过程及思路:部分代码1、keep-alive使用保留缓存实现:router配置:或者 <keep-alive> <router-view v-if="$route.meta.keepalive" :key...

2020-09-12 18:42:24 1581 1

原创 ES6 数组合并,向下查重且去除重复项;

应用场景:在项目中选择数组对象内容,选择后需要有所标识,或者默认会有一组数组对象数据追加到请求的数组中,且在最前端展示,其后加载过来的相同的数据对象将被替换掉;需要数组对象查重处理;主要代码实现:/*** * 其他内容代码略过; * 说明: * that.goodsList 结果内容; * that.paramsList 默认选中已有的数据对象内容; * list 为请求过来需要加入的内容,排除 已存在的对象****/const that = this;that.goo

2020-09-10 15:28:11 844

原创 表单内容改变 节流操作

一般情况下输入内容后,筛选对应的数据内容,如果每次输入每次请求过于频繁,使用节流的方式来减少请求的情况;watch: { 'params.search'(newVal,oldVal){ //添加空格不做处理 if(newVal.trim() == oldVal.trim()) return; // 输入框防抖 clearTimeout(this.debounceTimer); // 每次进来的时候都将之前的清除掉,如果还没到毫秒的时候就将之前的清除掉,

2020-09-08 19:18:28 198

原创 Js 递归查找数组中指定条件的一组对象;

需求:在多维数组中查找指定条件的对象,且取出该对象内容数据;数组数据格式如下:实现:方法一: // 递归查找 getParentId(list, iid) { for(let o of list || []) { if(o.category_id == iid) return o const o_ = this.getParentId(o.children, iid) if(o_) return o_ } },

2020-09-08 11:25:22 8304 6

原创 Vue/Js 递归函数封装:查询数组对象内容,合并至一个数组中

实现需求:把一个多维数组对象通过条件合并至一个数组中;如下图需求:递归代码封装实现:// 递归设置function setHandleListb(list) { const arr = []; let obj = {}; list.forEach(item => { const tmp = { ...item }; if(tmp.purview_tag){ if (tmp.children) {..

2020-09-02 15:57:17 2201

原创 Uni-App 页面跳转,返回相关操作

1、基本跳转:page.json文件:/******* 编辑商品内设置 ******/{ "easycom": { "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue" }, "pages": [ { "path": "pages/item/edit-components/itemSort", "style": { ...

2020-08-31 17:17:15 6092

原创 elementUi 表格内输入框深拷贝问题处理

问题:使用el-table 表格,其内有输入框内容,每行的表单内容设置后,不能影响其他行的数据内容;因为el-table 表格内容编辑框的值都是直接从表格的row中取值赋值的 属于浅克隆 所以同一源里的数值也会改变;解决方法:使用Object.assign()赋值,不要直接赋值;效果如下:主要代码如下:<template> <div class="system-ship-money overflow-auto"> <el-form :mo.

2020-08-27 11:25:10 1978

原创 Element Ui 切换页面后刷新,数据清空,缓存处理;

实现需求如下图所示:当添加的内容输入后,没有保存,切换了页面路由,再返回到此页面,数据内容消失了;需要保存输入的内容处理;方法一、通过添加缓存方法添加保存;以下是部分主要代码:主要本地存储代码// 取缓存 getStorage() { this.newVal = JSON.parse(localStorage.getItem('alloatAddInfo')) ? JSON.parse(localStorage.getItem('alloatAddInfo'))

2020-08-21 15:33:16 5205

原创 css3 文本超出处理和添加阴影效果

效果如下:代码修改阴影如下:.carousel { margin-top: -20upx; width: 100%; height: 320upx; box-shadow: 0px 20px 20px -20px #5E5E5E; // 主要 .carousel-item { width: 100%; height: 100%; padding: 0 28upx; overflow: hidden; } image { width:

2020-08-18 15:12:05 706

原创 Element UI table表格的使用细节项目实用

1. 使用表格时,表格列内容有时显示的顺序变化了,解决加 key属性方案如下:2.表格头部显示 类似于tooltip 的内容帮助提示:如下使用

2020-07-22 19:09:12 472

原创 ElementUi 使用PrintJs 实现基础打印功能

打印预览效果:代码简单实现: <el-button size="small" plain type="primary" @click="CreateOneFormPage">打印采购单</el-button> <el-table id="printJS-form" ref="table" :data="purchase_item" show-summ

2020-07-07 10:05:30 7436 3

原创 Js 数组中判断对象已存在提示,不存在择追加一条新内容;

数组中判断对象已存在,且提示;代码实现:// 判断循环有相同的值isEqualPd(arr1){ var isEqual = false for (var b = 0; b < arr1.length - 1; b++) { for (var j = b + 1; j < arr1.length; j++) { // eslint-disable-next-line eqeqeq if (arr1[b].total ==

2020-07-01 19:42:18 2937

原创 Element Ui 下拉选择框内追加添加按钮,点击可以追加新的选项内容

功能需求,在下拉选项框内,追加一个添加的按钮,点击可以添加新的被选项内容;效果展示如下:代码实现封装组件:<template> <span> <el-cascader ref="cascader" v-model="selectedOptions" size="medium" style="width:100%" :props="defaultParams" :options=

2020-06-28 14:25:05 12510 6

原创 Element Ui 表格内编辑排序设置

实现效果:代码实现:<!-- html --> <el-table-column prop="sort" label="排序" sortable width="72"> <template slot-scope="{row,$index}"> <div @dblclick="{{ chengenum($index) }}"> <el-input v-if="editable

2020-06-27 16:26:49 1011

a-tree 树型选择菜单组件关联节点选中动态设置

菜单多选设置,可用于权限多选,菜单多选等更多多选场景内使用。描述,通过树型弹框可以点击选择不同节点,且动态关联节点选中设置;如果勾选,则选中父节点则子节点自动选中,取消反选,如果取消勾选,则父子节点没有关联;

2023-08-21

uni-app 聊天内容自动滚动到底部

uniApp 实时聊天功能,当输入发送聊天消息后,聊天区域中的内容可以自动滚动到底部,以显示最新消息;

2023-05-16

uniApp 实时聊天Demo

uniApp可以实现实时聊天功能,其内实现了可发送文字内容,图片,语音;发送内容后区域内容自动滚动到底部以显示最新消息内容;本案例有两种效果实现;

2023-05-12

自定义手风琴内容效果.zip

一般企业网站用到的手风琴动画效果,鼠标滑入展开;

2021-07-08

常用前端内容分享设置.zip

常用于文章,新闻等内容分享到qq,新浪,微信等工具;

2021-03-26

内容超出无限滚动效果.zip

html 内容超出一定设置区域时,让其无限滚动滚动设置效果

2021-03-15

Element 图片上传封装图片质量压缩上传

项目中使用 element组件,而其图片上传组件无法达到实现图片质量压缩的需求,需要再次封装,可以对上传的较大的图片质量进行压缩处理等;部分代码,仅供参考使用!

2020-10-12

ElementUi 图片上传处理.zip

项目中使用ElementUi 框架 ,实现图片上传功能,图片需要处理,如图片格式,图片大小,图片个数等,图片删除,修改上传等,图片上传地址需要通过处理为网址,而非base64等;常用的基本功能,本栗子是通过图片空间上传,且可以选择。

2020-08-07

Ueditor 富文本编辑器及图片转换.zip

项目中使用富文本编辑器编辑更多内容时,图片输出默认情况下为base64编码格式,需转换为需要的网址格式,且上传图片到指定地址等;

2020-08-07

ElementAboutTimer.zip

Element ui 关于时间设置,通过快捷选择 本月,上月,本周,上周选项卡效果的按钮, 时间输入框可以直接显示时间结果的内容,联动效果实现;附带Echars 图表绘制的使用封装

2020-08-01

skuItems.zip

商品添加时实现多规格编辑,添加功能,及element UI 的其他下拉选择器的改造设置;本内容仅部分内容,根据需求需要再改造使用!

2020-07-02

微信小程序自定义规格弹框组件及使用.zip

微信小程序中自定义规格的弹框组件,可以在多个页面中使用,方便快捷!主要用于商城类的小程序添加选择规格;本内容仅部分内容,仅供参考使用,具体情况根据项目情况自行修改!

2020-03-28

shopcarTemp.zip

手机端常用的商城购物车实现效果,此内容主要是通过vue方法封装而成的组件,使用起来更加的方便;可直接使用vuecli脚手架引入文件内容模块即可使用;其具体内容可以根据项目具体情况修改添加等;

2020-03-17

php时钟设置

php小demo,设置一个时钟,可以跟随本地的时间时时走动等。

2017-06-19

空空如也

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

TA关注的人

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