MR.杜的博客

原创 js 正则表达式

el-input v-model="form.mobilePhone" placeholder="请输入手机号" maxlength="11" oninput="value=value.replace(/[^\d\-\d]/g,'')">只允许数字和字母和符号。

原创 二级多选el-check 组件 vue2

【代码】二级多选el-check 组件 vue2。

原创 google浏览器禁止http自动转https

搜索“HTTPS Upgrades”并将其设置为“Disabled”。这将禁用Chrome自动将HTTP升级到HTTPS的功能。在Chrome的地址栏中输入。

原创 禁止复制(vue指令)

禁止复制 vue vue指令 前端

原创 el-input 双向绑定失效

但是在使用中文输入法输入按shift切换到英文输入法时，再输入的数字会获取不到，这个时候发现双向绑定失效，所以需要重新赋值，改成以下代码可以实现。项目需要只能输入数字，所有使用oninput+正则来限制。

原创 前端文件下载(接口返回二进制流)

前端 文件下载

原创 el-data-picker禁用时间(vue2 vue3)

如果要用到跨选时间禁用（不能选择时间范围超过三个月、半年、多少天等，选择了开始日期时开始判断）大体思路如上 按照需求修改对应代码即可。

原创 IntersectionObserver 曝光埋点

【代码】IntersectionObserver 曝光埋点。

原创 引用数据类型 栈内存 堆内存

原因：基本数据类型存储在栈内存中，引用数据类型存储在堆内存中 ，引用数据类型存储在堆内存中会在栈内存中创建一个指针，栈内存中的这个指针指向堆内存中的地址，所以let n=m；相当于n指针也指向和m相同的地址 修改n既修改m（既所说的浅拷贝）JSON.parse(JSON.stringify）这个方法可以简单粗暴的实现深拷贝，但是还存在问题，拷贝的对象中如果有函数，undefined，symbol，当使用过JSON.stringify()进行处理之后，都会消失。想要避免这种情况可以如下操作（深拷贝）

原创 el-table 表格自带全选按钮隐藏

/ 隐藏表格的全选当页按钮。

原创 el-tree 背景色

【代码】el-tree 背景色。

原创 el-upload上传文件前端自己读取excel

1.读取方法 需要下载xlsx依赖。

原创 项目域名协议https,访问接口链接协议http

Mixed Content: The page at https://* was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint http://*. This request has been blocked; the content must be served over HTTPS

原创 node管理器 nvm

node管理器 nvm

原创 前端css 纯数字或者字母 溢出不换行

前端css 纯数字或者字母 溢出不换行

原创 前端登录流程

前端登录流程

原创 el-table 在苹果浏览器safari 中表头错乱

全局样式中设置，即可兼容。

原创 css保留格式文本换行

也可以用富文本保留文本格式 恰逢场景需要且能使代码简洁故用css实现。连续的空白符会被合并。连续的空白符会被保留。连续的空白符会被保留。元素，或者需要为了填充「行框盒子(元素，或者需要为了填充「行框盒子(

原创 vue锚点链接

其中，"start"表示将元素的左边与可见区域的左边对齐，"center"表示将元素的中部与可见区域的中部对齐，"end"表示将元素的右边与可见区域的右边对齐，"nearest"表示将元素滚动到可见区域内，如果元素已经在可见区域内，则不进行滚动。其中，"start"表示将元素的顶部与可见区域的顶部对齐，"center"表示将元素的中部与可见区域的中部对齐，"end"表示将元素的底部与可见区域的底部对齐，"nearest"表示将元素滚动到可见区域内，如果元素已经在可见区域内，则不进行滚动。

原创 js回到顶部

【代码】js回到顶部。

原创 前端项目使用钉钉字体

项目中有时需要一些斜体字体，使用钉钉字体。App.vue中加入。

原创 js 异步

原创 el-table不使用height自适应高度 表头固定

【代码】el-table不使用height自适应高度 表头固定。

原创 vue2 组件传参 v-model

等价于加上$emit('input',值) 就可以改变 v-的值。父组件子组件。

原创 ngrok实现内网穿透，vue项目invalid host header报错

1.注册并下载ngrok，注册的时候需要验证码，有时候登不上去，用到了外网。（我用的是猎豹加速器，可以每天登录签到，有一个小时的使用时长）5.输入下面的命令，即将本地端口8080映射到外网中，如果需要映射其他端口，只需将8080改成相对应的端口即可。内网穿透访问Vue项目的时候，页面出现Invalid Host header。4.执行上面的命令，会自动创建一个配置文件ngrok.yml。生成一个链接，这个链接在其他网络环境下都可以访问。目的：使自己的本地的vue项目可以在外网上访问。打开链接，显示出项目。

原创 nginx 内网互相访问

下载地址 http://nginx.p2hp.com/en/download.html。conf/nginx.conf 配置。

原创 小程序 切换tab 定位到对应模块

【代码】小程序 切换tab 定位到对应模块。

原创 npm发包（Verdaccio） 自定义组件库

删除：npm unpublish qlm-db-test --force --registry http://xxx:4083/（包地址）开发 npm publish --tag alpha --registry http://xxx:4083。测试 npm publish --tag beta --registry http://xxx:4083。登录：npm login --registry http://xxx:4083/ （包地址）开发 npm version x.x.x-alpha.1。

原创 element table 每行点击已读置灰

【代码】element table 每行点击已读置灰。

原创 Element plus data-picker禁用

【代码】Element plus data-picker禁用。

原创 js控制动态图片url 无法找到图片路径

正常的图片引入是用img标签或者元素背景图的方式，采用这种方式的图片，webpack都能正常打包并显示。但是如果直接在js文件中定义图片路径，并赋给图片元素的话不能正常显示的，这是因为webpack打包后，会将静态资源文件放在dist/static/img下，我们的网站实际上以dist目录作为根目录，并由此加载该目录下的index.html所需的css、js、img等。我们build后发现，图片根本不会打包输出到dist目录（webpack是按需打包的）。解决方法：require引入的方式。

原创 小程序scroll-view去除滚动条

使用官方配置项渲染时,ios滚动会发生卡顿 ，原因和enhanced有关。

原创 小程序节点监视IntersectionObserver

【代码】小程序节点监视IntersectionObserver。

原创 微信小程序胶囊提示气泡

【代码】微信小程序胶囊提示气泡。

原创 vue-cli脚手架和npm init vue@latest 区别

npm init vue@latest项目是基于vite打包的。脚手架创建的vue3项目是基于webpack打包的。

原创 vue直接添加属性是否响应式

【代码】vue直接添加属性是否响应式。

原创 关于elementUI 日期选择器

elementUI 日期选择器选择日期时间回显异常Vue无法监听 Vue实际上无法监听由第三方插件所引起的数据变化。因此上面的方法是行不通的。但是，Vue给我们提供的一个方法，它可以将任意数据转化为可以被Vue监听到的数据，他就是：vm.$set。

原创 文件导出下载到本地

【代码】文件导出下载到本地。

原创 echars图片保存图片到本地操作

注意：canvas.toDataURl()该方法是将canvas转成图片，如果html中有跨域请求的图片资源，那么canvas就会报错不支持跨域。需求：将echars的图片添加到保存至本地操作。echars本质是canvas。

原创 字符串方法padStart / padEnd

如果某个字符串不够指定长度，会在头部或尾部补全。ES2017 引入了。