- 博客(138)
- 收藏
- 关注
原创 关于级联选择器el-cascader的踩坑及解决
解决:给级联选择器加key,key的值是:new Date().getTime(),在每次数据改变的时候更新key,即this.keyIndex = new Date().getTime()我的报错使用场景:级联选择器是遍历出来的,数据也是遍历的数组里面的,报错的原因是我删除了option绑定的数组,因为后台接口不需要这个数据。但是这个方法是有默认参数的,当不满足自己的需要,需要传其他参树的时候,搜索的建议面板和原来的dom不是同一个dom。在获取到数据之后,对数据进行整体处理。
2023-12-05 10:53:44 1055
原创 web端调节麦克风和扬声器的音量
这是一个基本的示例,具体的实现可能因浏览器兼容性和具体需求而有所差异。在 Web 端调节麦克风和扬声器的音量,可以使用 WebRTC(Web Real-Time Communications)技术和相关的 API 来实现。通过设置音量控制节点的 gain 属性来调节音量,取值范围为 0(静音)到 1(最大音量)。通过设置音量控制节点的 gain 属性来调节音量,取值范围为 0(静音)到 1(最大音量)。需要注意的是,以上操作需要在用户许可的情况下进行,因为涉及到访问用户的麦克风和扬声器。
2023-10-30 10:05:57 618
原创 vue前端页面添加水印
为了防止内行人打开控制台,将带水印的元素的背景图取消勾选,可以通过MutationObserver监听一下dom元素的变化。第二步:通过canvas创建图片,以背景图的方式实现水印。第三步:通过样式,使有水印的与阿奴布满屏,并处于最上层。第一步:创建一个放水印的元素。
2023-10-16 14:14:02 92
原创 关于npm run build:prod和npm run build:stage的区别解释
npm run build:prod和npm run build:stage的区别
2023-04-26 17:12:24 7700
原创 一个数组中有多个对象,判断这些对象中的某个值是否和给定的对象中的某个值相等
一个数组中有多个对象,判断这些对象中的某个值是否和给定的对象中的某个值相等,如果不想等就添加到数组中,反之不处理
2022-07-15 10:49:57 513
原创 vue数据双向绑定的原理
采用数据劫持跟发布者-订阅者模式实现的通过Object.defineProperty(obj,“name”,{})给对象的各个属性绑定getter和setter函数,当数据变化时,发布消息给订阅者,触发相应的监听回调watcher订阅者是Oberver和Complier之间通信的桥梁,主要做的事情:在初始化时将自身添加至dep中自身必须有一个update()方法待属性变动dep.notice()通知时,能调用自身的update()方法,并触发Compile中绑定的回调,则功成身退。简单实现双向
2022-05-18 15:53:22 275
原创 使用canvas模拟签字功能
<template> <div class="indexs"> <!-- 签名开始--> <div class="signature" v-if="showSignature" @click.stop> <div class="signature_content" style="position: relative;"> <div style="margin-top: 20p
2021-12-14 18:05:22 1358 1
原创 防抖和节流的使用
export function simpledebounce(func, wait = 1000, immidate = true) { let timer = null; return function() { //this指向问题 let context = this; //拿到参数 let args = [...arguments]; clearTimeout(timer); if (immidate) { let callNow =
2021-12-01 16:41:28 234
原创 级联选择器的使用cascader
<el-cascader :options="options" v-model="ruleForm.orgList" :props="props" size="small" clearable style="width: 104%" filterable></el-cascader>ruleForm.orgList:[]options:[ { orgId:1, orgName:'机构1', }]props:{ value:
2021-11-17 17:00:34 362
原创 前端实现拖拽排序效果
<div class="link-add"> <div class="formTitle">流程环节</div> <div class="link-add-list"> <div class="test_wrapper" @dragover="dragover($event)"> <transition-group class="transition-wrapper" name="sort">
2021-11-16 17:06:36 2447 2
原创 机构树实现添加子节点、添加父节点
<template> <div class="app-wrapper"> <headerTitle :titleList="titleList" :hideButton="true" /> <div class="app-container" id="instructor-detail"> <div class="block" style="display: flex"> <div class=
2021-07-21 20:25:22 592
原创 多选框组合实现全选和全不选
html:<div> <el-checkbox-group v-model="infoForm.id" style="" @change="changeCheckCondiction"> <el-checkbox v-for="item in checkList" :label="item.code" :key="item.code">{{item.descript}}</el-checkbox> </el-checkbox-group
2021-07-21 20:22:53 443
原创 正则表达式
线上测试工具:https://c.runoob.com/front-end/854示例:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-widt
2021-06-25 15:34:24 152
原创 导入导出功能的实现
使用bootstrap模板1.导入:html代码:<!--批量导入文件模态框--><div class="modal fade" id="exportfile" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"> <div class="modal-dialog" role="document" style='margin: 138px auto'> <di
2021-05-12 14:52:54 969
原创 将字符串用逗号分隔,并换行,最后在弹框中显示
代码案例:效果:出上述方法外,还可以使用字符串插值的办法:1.'<strong>'+变量+'</strong>'2.`${value}my name ${value}`
2021-03-19 11:02:28 512
原创 定时器之计时(时间的转换)
###示例:1.需求描述:当点击开始按钮时开始计时,点击结束时停止计时。并将最后的时间转化为相应的00:00:00的格式方案1:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>
2021-02-23 18:57:08 807
原创 vue-cli创建一个项目并引入axios,router等相关插件
vue create app01; //创建一个项目npm install ;//安装依赖npm run serve; //启动项目安装必要的组件,如axios,router,element等4.1. 安装axios:1》npm install axios --save-dev出现如下结果,则安装成功2》在main.js中引入axios3》即可使用axios引入element-ui1》安装:npm install element-ui --save2》在main..
2021-02-23 18:56:34 323
原创 浮动布局及清除浮动的方法
浮动元素的特点: 1.脱离标准流的控制,浮动的盒子不再保留原先的位置 2.行内元素具有浮动,可直接设置宽高属性 3.块级元素没设置宽度,默认宽度和父级一样宽,但是添加浮动后,大小由内容决定 4.浮动的盒子中间没有空隙为什么清除浮动: 很多情况下,父元素不方便设置高度,高度由子元素撑起,但子元素浮动,就会影响下面的父级元素的排版,为了不影响下面的父元素,就需要清除浮动== 如何清除浮动:== 1.额外标签法: 在浮动元素
2021-02-02 19:27:33 220
原创 jquery的序列化serialize()以及导出,重置功能的实现
//序列化 serialize(data) { var arr = []; for (let key in data) { arr.push(key + "=" + data[key]); } return arr.join("&"); }, //导出 exportAudio:function(){ var obj = ..
2021-01-27 18:30:31 240
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人