前端
别拿曾经看以后~
这个作者很懒,什么都没留下…
展开
-
前端常用UI框架
常用ui框架原创 2023-07-24 17:06:57 · 916 阅读 · 0 评论 -
react生成二维码插件(qrcode.react)
qrcode.react原创 2023-02-24 14:43:42 · 753 阅读 · 0 评论 -
vue element el-select下拉滚动加载
vue element el-select下拉滚动加载转载 2022-11-25 14:17:43 · 2412 阅读 · 0 评论 -
【Vue】下拉框加分页搜索
【Vue】下拉框加分页搜索原创 2022-11-24 10:24:27 · 2101 阅读 · 3 评论 -
【Vue】url拼接参数获取解析
【Vue】url拼接参数获取解析原创 2022-11-15 17:04:24 · 5496 阅读 · 0 评论 -
Vue项目埋点方案
Vue项目埋点转载 2022-10-31 13:53:39 · 1898 阅读 · 2 评论 -
iframe/window.open/a三种标签打开新页面或新窗口设置请求头;实现免密登录
iframe/window.open/a三种标签打开新页面或新窗口设置请求头原创 2022-10-20 09:56:53 · 10725 阅读 · 0 评论 -
JS合并数组对象中key相同的数据(将数组里某个属性相同的对象合并成一个数组)两种方案
js合并数组对象中key相同的数据转载 2022-10-14 15:13:05 · 801 阅读 · 0 评论 -
【Vue】路由+左侧菜单
vue路由原创 2022-09-23 11:25:18 · 1966 阅读 · 0 评论 -
vue中this.$confirm,确定和取消执行不同的逻辑处理
【代码】vue中this.$confirm,确定和取消执行不同的逻辑处理。转载 2022-08-31 17:24:40 · 2088 阅读 · 0 评论 -
【React/Vue】事件触发
【React/Vue】事件触发。原创 2022-08-25 18:21:44 · 743 阅读 · 0 评论 -
获取当前时间
获取当前时间。原创 2022-08-15 14:34:07 · 113 阅读 · 0 评论 -
Vue中防止按钮重复点击提交的方法
Vue防止按钮重复点击转载 2022-06-28 16:20:14 · 9805 阅读 · 0 评论 -
【Vue】vue变量赋值到路由title上,改变title的值
通过document.title = 'xxx’来修改路由title值原创 2022-06-24 13:58:42 · 1023 阅读 · 0 评论 -
使用a标签的href来实现点击手机号拨打电话
a标签在移动端(h5)拨打电话转载 2022-06-23 15:37:55 · 1306 阅读 · 0 评论 -
使用a标签的href来实现点击手机号拨打电话
a标签在移动端(h5)拨打电话转载 2022-06-21 14:00:27 · 733 阅读 · 0 评论 -
【js或ts】获取当前时间及一小时后时间
TSJS转载 2022-06-08 09:44:51 · 5764 阅读 · 0 评论 -
el-cascader 校验不能为空
前言:由于vue中form表单的检验是否通过是取决于form表单中对应的属性是否有值,有值则无提示信息,无值则有提示信息。<el-form :model="form" :rules="rules"> <el-form-item label="地区" prop="address"> <el-cascader :props="props" @change="handleCheckData" ></el-cascader>原创 2022-05-09 11:35:44 · 1750 阅读 · 0 评论 -
【ElementUI】dialog弹窗出现闪屏问题解决办法
场景:在使用vue+elementui开发项目的时候提示信息一般会使用el-dialog组件,此时是没有问题的。但当我们多次调用弹窗的时候,比如:有A,B,C三个弹窗,当弹窗A点击确定的时候关闭弹窗A打开弹窗B,当弹窗B点击确定的时候关闭弹窗B打开打开弹窗C,在弹窗切换的时候会出现闪烁一下的情况。原因是:当一个弹窗关闭之后另一个弹窗可能还没打开,这个中间的空格期就是会出现遮罩层也就是我们说的闪烁情况。如下:解决办法:给需要关闭的弹窗设置时间间隔。比如需要关闭弹窗A(:visible.sync=‘di原创 2022-04-15 16:15:23 · 7942 阅读 · 1 评论 -
js判断当前屏幕的宽高以及设备类型
获取屏幕宽高:Javascript:网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWidth (包括边线的宽)网页可见区域高: document.body.offsetHeight (包括边线的高)网页正文全文宽: document.body.scrollWidth网页正文全文高: document.body.scrollHeight网页被卷去原创 2022-03-21 15:36:57 · 1610 阅读 · 0 评论 -
【vue】vue事件的触发
前言:elementui中的选择框el-select有很多可用的事件,比如change事件,但是如果想实现点击下拉框的时候就触发时间的话,el-select并没有提供好用的事件方法,这个时候可以使用@hook:created=“handleData”,实现代码如下:<el-select @hook:created="handleData()"> <el-option value="0">男</el-option> <el-option value="1"&原创 2022-02-10 17:25:30 · 2027 阅读 · 0 评论 -
【nvm】切换node版本号
前言:开发有时候为了方便会想着能够实时的切换node的版本号,比如node14.18.2和node16.13.1的切换,这个时候就需要nvm了步骤:1.安装–nvm2.查看nvm是否安装成功–nvm list3.安装node–nvm install node版本号 电脑位数,例如:nvm install 14.18.2 64-bit4.使用nvm切换node–nvm use node版本号,例如:nvm use 14.18.2注意:在安装node的时候已经把node包管理器npm安装进去了原创 2021-12-20 12:27:54 · 615 阅读 · 0 评论 -
【百度地图】折线图平面图
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="utf-8"> <title>地图展示</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-sc原创 2021-11-17 09:45:24 · 882 阅读 · 0 评论 -
git代码提交拉取指令
1.更新–git pull origin 默认分支2.添加提交文件到暂存区–git add .(提交全部),git add 文件名(提交指定文件)3.提交到本地分支–git commit -m 用户故事 ‘提交说明’4.提交到远程分支–git push原创 2021-11-16 09:30:48 · 136 阅读 · 0 评论 -
el-table表格操作列合并行
前言:在使用el-table的时候经常会涉及到表格的列合并,包括表格操作列的合并,本篇博客主要讲的是表格操作列的合并,至于其他列的合并可以参考另一篇博客:https://editor.csdn.net/md/?articleId=120849823操作列的合并1,首先在el-table上加:span-method="objectSpanMethod"方法2,在objectSpanMethod方法中加合并操作列的逻辑处理,原理就是:操作列的合并行数是需要根据前面具体的某列的合并行数来合并具体行数的,换原创 2021-11-01 10:09:37 · 4022 阅读 · 1 评论 -
跨域解决方案
实际开发中经常会遇到跨域问题,下面有关于解决跨域的方案:http://mp.weixin.qq.com/s?__biz=MzIyMDkwODczNw==&mid=2247502496&idx=1&sn=8af98c71550c44d1b52a2a14f509a5a5&chksm=97c6570ea0b1de18f23f1ab06757a0d7867f850356a8ce700723b276a263d5803297d3e278d6&mpshare=1&scen原创 2021-10-28 10:59:14 · 92 阅读 · 0 评论 -
【前端】导出Excel表格
1.首先后台需要写导出接口2.前端调用接口进行处理<input name="button" type="button" class="data-searchbtn" style="width:80px;" value="导出" @click="exportList()"/><script> //导出 exportList(){ axios({ url: '导出接口', headers: { "Content-Type": "ap原创 2021-10-21 10:39:30 · 172 阅读 · 0 评论 -
elementUI Table的行合并通用方法
前言:有些业务需求是需要table进行行合并的,下面根据其他博客的方法整理了下通用方法,如下:通用方法:/**在工具类util.js中定义通用方法 * table合并行通用 */// eslint-disable-next-line space-before-function-parenexport default mergeTableRow(config) { let data = config.data const { mergeColNames, // 需要合并的列转载 2021-10-19 17:04:58 · 3946 阅读 · 11 评论 -
解决Chrome浏览器跨域问题
前言:在调试接口的时候经常会遇到接口跨域的问题,解决接口跨域问题的方法有很多种,比如proxy代理,浏览器直接修改属性,可能对于我们来说最方便的就是直接修改chrome浏览器属性,具体步骤分为如下两步:步骤:1.Chrome浏览器右击选择属性—>在目标位置的…chrome.exe" 后面加上–disable-web-security --user-data-dir=D:\MyChromeDevUserData这段配置—>点击确认2.在D盘的根目录下面新建MyChromeDevUserD原创 2021-09-18 16:37:51 · 1998 阅读 · 0 评论 -
【javascript】实现图片预览以及左右切换
代码:css样式:/* 触发弹窗图片的样式 */ #myImg { border-radius: 5px; cursor: pointer; transition: 0.3s; } #myImg:hover {opacity: 0.7;} /* 弹窗背景 */原创 2021-09-14 18:56:30 · 453 阅读 · 0 评论 -
前端如何直接测试生产环境功能
前言:现在很多项目都是前后端分离项目,一般前端开发人员都是在本地或者测试环境开发调试项目,但是有时候也想看到生产环境的效果,这个时候可以按照如下步骤操作:步骤:第一步:使用npm install build命令打dist包,打好后的dist包是放下项目根目录下的,可以让后台把这个dist包放在apache或nginx服务器上,也可以前端自己放到服务器上,作为前端开发人员,我们还是自力更生吧。第二步:使用npm install -g serve命令全局安装serve运行生产环境第三步:使用serve原创 2021-09-09 17:42:38 · 1998 阅读 · 0 评论 -
【vue】slot插槽的使用
前言:slot插槽:所谓的插槽意思就是相当于占位符。作用:把父组件中各种类型的内容展示在子组件中分类:具名(命名)插槽,作用域插槽,解构插槽等等总结:(1)父组件向子组件通信传值—props(写在子组件中)(2)父组件调用子组件的方法或属性—ref(写在父组件中的子组件上)(3)父组件调用子组件的值,即子组件向父组件传值—emit(写在子组件中)(4)父组件的内容展示在子组件中—slot(写在子组件中)代码如下:1.主体插槽slot:slot有默认的名字name=“defalut”,不写原创 2021-09-04 16:05:17 · 505 阅读 · 0 评论 -
【VUE】组件的递归
前言:在使用vue框架进行开发的时候可能会使用到组件的递归,比如常见的树形结构。代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />原创 2021-09-04 11:57:51 · 319 阅读 · 0 评论 -
【Vue】 关于Vue生命周期activated以及keep-alive的使用
activated:{}----是vue的生命周期,指的是激活keep-alive缓存,优化性能,与之对应的生命周期是deactivted。例如://如果页面中有keep-alive缓存,这个函数会触发activated(){}keep-alive(缓存)使用场景:当A页面跳转到B页面,做完操作之后B页面再返回A页面,这个时候A页面的数据还是存在的,就需要在A页面中使用keep-alive缓存。使用方法:keep-alive一般是和路由router-view结合使用的。因为在Vue中页面.原创 2021-09-02 18:18:42 · 3877 阅读 · 0 评论 -
关于render (h){return h(‘router-view‘)}的理解
前言:render (h){return h(‘router-view’)}中的h函数是Vue.js中的createElement函数,所以render (h){return h(‘router-view’)}等价于render (createElement){return createElement(‘router-view’)}。最终的目的是创建并渲染一个DOM元素节点例如:<div id="app"> <router-view></router-view&g转载 2021-09-02 17:43:16 · 2752 阅读 · 0 评论 -
【Vue】兄弟组件传值+父向子传值+子向父传值+父调子方法属性
前言:vue框架中的主要传值方式有3种,父组件向子组件传值,子组件向父组件传值,以及兄弟组件间传值,下面分别介绍下这三种传值情况。【父组件向子组件传值—通过props】<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,m原创 2021-09-01 16:45:57 · 181 阅读 · 0 评论 -
【微信小程序】腾讯地图定位搜索以及获取具体的省市区
Page({ data: { logo:'', jumpUrl:'', mapUrl:'', addressMap:'', latitudeMap:'', longitudeMap:'', nameMap:'', provinceMap:'', cityMap:'', countryMap:'', typep:'' }, onLoad: function(options) { this.setDa原创 2021-08-25 09:15:05 · 1495 阅读 · 0 评论 -
正则表达式案例
//字符串替换let str = ‘2.2.2’let restr = str.replace(/./g,’’) // -->222 replace全部替换字符串里的符号,要加 \ ,重点// input输入框只能输入数字,最多2位小数的 oninput事件触发value.replace(/^\D*(\d*(?:.\d{0,2})?).*$/g, ‘$1’)phone :“regex”:/^([(]{1}[0-9]{2,6}[)])?([0-9]{3,20})((x|ext|extensi原创 2021-08-19 09:43:59 · 20906 阅读 · 0 评论 -
H5页面监听小程序的返回
把如下代码放在预加载中:window.history.pushState(null, null, "#"); window.addEventListener("popstate", function (e) { window.history.pushState(null, null, "#"); //调用的toZlApplyOrderIndex方法是跳转h5页面方法,具体可以参考交通项目的searchZlBus页面 t原创 2021-08-17 11:06:05 · 896 阅读 · 0 评论 -
【微信小程序】关于客服会话的客服人员使用规则
使用小程序的客服会话功能,第一步:客服会话写在页面中,第二步:有以下两种方法实现客服会话功能。一是通过调用接口的方式,二是直接使用微信提供的网页版客服工具或小程序客服助手。第三步:在小程序后台添加客服人员,最多可以添加99个(服务多人)。服务多人指的是:等同于客服人员规则。客服人员规则:A,B,C三个客服人员,A,B,C三个用户。1.当A,B,C三个客服都在线的时候,A,B,C三个用户发送的信息会随机分配到A,B,C三个客服那边,只要客服一直在线,则用户发送的信息会一直被对应的客服接收到(比如:A客..原创 2021-07-22 17:34:25 · 4273 阅读 · 0 评论