<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[LGEC_的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/LGEC_</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; LGEC_]]></copyright><item><title><![CDATA[百度地图离线地图实现]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/147999274</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/147999274</guid><author>LGEC_</author><pubDate>Fri, 16 May 2025 14:33:08 +0800</pubDate><description><![CDATA[百度地图离线地图实现demo]]></description><category></category></item><item><title><![CDATA[扫码枪踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/137136272</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/137136272</guid><author>LGEC_</author><pubDate>Fri, 29 Mar 2024 11:09:49 +0800</pubDate><description><![CDATA[仓储、收银、快递等方面扫码枪都应用的非常广泛，所以也来尝试接入一下扫码枪，这篇文章是接入成功后的踩坑指南综合1和2，最省心的办法就是二维码内容只有字符和数字，那就万无一失，或者每次扫码前确认输入法是英文(扫码枪设置使用虚拟键盘，不然识别到汉字后电脑输入法可能会自动变为中文输入法)。这样在保证需要扫码枪的页面没有输入框，就可以写一个看不见的输入框，在扫码时自动获取焦点，之后直接取输入框的值就行，当然扫码结束后要清空隐藏输入框内容。]]></description><category></category></item><item><title><![CDATA[Element UI 表格拖动到左侧树]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/132894572</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/132894572</guid><author>LGEC_</author><pubDate>Fri, 15 Sep 2023 09:51:24 +0800</pubDate><description><![CDATA[随着互联网的不断发展，网页的便捷性操作也越来越重要，方便快捷的操作方式越来越受人青睐，本文就介绍了表格拖动到树的操作逻辑，方便用户修改表格数据的所属。前期花费了大量时间去使用各种VUE拖动插件(vuedraggable、sortablejs之类)，但都无法满足我的需求，最后还是原生JS比较靠谱，才有了今天这篇文章。以上就是我的表格拖动到左侧树方案，有不同的见解或者疑问，欢迎留言。]]></description><category></category></item><item><title><![CDATA[VUE页面导出PDF踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/132224198</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/132224198</guid><author>LGEC_</author><pubDate>Fri, 11 Aug 2023 16:01:40 +0800</pubDate><description><![CDATA[导出方案用的是html2canvas+jspdf，简单的导出很容易实现，但是也会有一些问题：一是不同分辨率下导出内容不同的问题，这个需要固定导出内容的宽度；二是会遇到页面内容被切割的问题，因为导出原理是先使用html2canvas将DOM元素转换为canvas，再利用 canvas 的 toDataURL 方法输出为图片，之后使用jspdf添加图片生成PDF。图片生成PDF过程中必然用统一的格式切割图片分页，所以内容很容易被切割；]]></description><category></category></item><item><title><![CDATA[Element UI 动态表格踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/131200371</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/131200371</guid><author>LGEC_</author><pubDate>Wed, 14 Jun 2023 11:29:24 +0800</pubDate><description><![CDATA[Element UI 动态表格踩坑指南，可避免出现表格表头、内容错位问题。]]></description><category></category></item><item><title><![CDATA[VUE导出多级表头Excel]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/126406138</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/126406138</guid><author>LGEC_</author><pubDate>Thu, 18 Aug 2022 15:38:37 +0800</pubDate><description><![CDATA[VUE导出多级表头Excel]]></description><category></category></item><item><title><![CDATA[uni-app 踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/125782384</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/125782384</guid><author>LGEC_</author><pubDate>Mon, 01 Aug 2022 16:04:44 +0800</pubDate><description><![CDATA[uni-app 踩坑指南]]></description><category></category></item><item><title><![CDATA[CSS calc()函数]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/125441916</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/125441916</guid><author>LGEC_</author><pubDate>Fri, 24 Jun 2022 11:57:18 +0800</pubDate><description><![CDATA[一、calc()函数介绍
二、calc()函数与val()联合使用]]></description><category></category></item><item><title><![CDATA[图片预览插件Viewer.js的使用]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/124824617</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/124824617</guid><author>LGEC_</author><pubDate>Tue, 17 May 2022 17:03:36 +0800</pubDate><description><![CDATA[一、相关资源

Viewer 下载地址： https://github.com/fengyuanchen/viewerjs
其中docs文件夹下是使用演示：



PS: 图片预览依赖的资源可以使用docs文件夹下css文件夹下的viewer.css和js文件夹下的viewer.js，也可以使用dist文件加下压缩后的资源：viewer.min.css和viewer.min.js

二、使用介绍

简单使用如下：

&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;

]]></description><category></category></item><item><title><![CDATA[Element UI 踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/124475789</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/124475789</guid><author>LGEC_</author><pubDate>Thu, 28 Apr 2022 15:56:46 +0800</pubDate><description><![CDATA[一、ElementUI 弹框内图片预览遮罩显示到了最外层

只需要在图片预览弹框组件上添加:append-to-body="true"就行

	&lt;el-upload
	   ref="licenceUpload"
	   action="xxx"
	   :limit="6"
	   multiple
	   list-type="picture-card"
	   :http-request="uploadImg"
	   :before-upload="beforeAvatarUpload"
	 ]]></description><category></category></item><item><title><![CDATA[鼠标事件穿透遮盖物]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/124313786</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/124313786</guid><author>LGEC_</author><pubDate>Thu, 21 Apr 2022 10:17:23 +0800</pubDate><description><![CDATA[一、鼠标事件穿透遮盖物

正常来说当有点击事件的元素被遮盖时，点击事件是不生效的，如下

&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
    &lt;meta name="viewport" content="width=device-width]]></description><category></category></item><item><title><![CDATA[海康web插件视频播放异常]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/123681335</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/123681335</guid><author>LGEC_</author><pubDate>Wed, 23 Mar 2022 11:21:45 +0800</pubDate><description><![CDATA[海康web插件视频播放异常解决方案

下载海康插件VideoWebPlugin.exe后，低版本谷歌可以正常播放视频，高版本不行
因为新版本google内核安全策略升级，公域资源不能访问电脑私域资源，造成视频不能播放。
处理方案：使用出现问题的浏览器访问如下地址

	chrome://flags/#block-insecure-private-network-requests


禁用该安全策略



...]]></description><category></category></item><item><title><![CDATA[css多边形区域显示]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/123678160</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/123678160</guid><author>LGEC_</author><pubDate>Wed, 23 Mar 2022 09:49:59 +0800</pubDate><description><![CDATA[可以使用css中的clip-path属性将内容区域裁剪成圆形、椭圆形、多边形。代码如下：

&lt;style&gt;
        .box {
            width: 200px;
            height: 200px;
            margin: 10px 40px;
            background: #4FA6E5;
        }
        /* 圆 ：必须是正方形，否则长边无裁剪*/
        .round {
     .]]></description><category></category></item><item><title><![CDATA[vscode 代码格式化]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/123419830</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/123419830</guid><author>LGEC_</author><pubDate>Fri, 11 Mar 2022 11:16:21 +0800</pubDate><description><![CDATA[1、安装vscode 扩展 Beautify
2、文件=&gt;首选项=&gt;设置，打开设置找到扩展里的Beautify


在settings.json中编辑

{
  "editor.fontSize": 16,
  "workbench.colorTheme": "Visual Studio Dark",
  "workbench.startupEditor": "newUntitledFile",
  "files.associations": {
      "*.wxml": "html"
 ]]></description><category></category></item><item><title><![CDATA[前端踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/121776043</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/121776043</guid><author>LGEC_</author><pubDate>Tue, 07 Dec 2021 18:50:39 +0800</pubDate><description><![CDATA[一、使用原生js开发分页功能
// 分页逻辑
const pagination = function (option, fun) {
    this.parentId = option.id;                             //容器
    this.pageSize = option.pageSize || 1;                  //每页显示多少条
    this.totals = option.totals || 0;                   ]]></description><category></category></item><item><title><![CDATA[JS 正则校验总结]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/121625684</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/121625684</guid><author>LGEC_</author><pubDate>Tue, 30 Nov 2021 10:01:53 +0800</pubDate><description><![CDATA[1、电话号码校验
复杂校验：
	/^((13[0-9])|(14[5,7])|(15[0-3,5-9])|(17[0,3,5-8])|(18[0-9])|166|198|199|(147))\d{8}$/

普通校验：
	/^1[3|4|5|6|7|8|9 ][0-9]\d{8}$/

2、邮箱校验
	/^([a-zA-Z0-9]+[_|_|\-|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,6}$/


...]]></description><category></category></item><item><title><![CDATA[VUE踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/121530006</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/121530006</guid><author>LGEC_</author><pubDate>Thu, 25 Nov 2021 09:18:47 +0800</pubDate><description><![CDATA[一、环境变量添加没反应
添加环境变量VUE_FILE_BASE_URL之后，暂停服务重新运行，但是使用console.log(process.env)打印没有发现这个字段。本来以为是哪里还需要配置一下，结果。。。

只有以 VUE_APP_开头的变量会被 webpack.DefinePlugin 静态嵌入到客户端侧的包中????????????

二、后续补充。。。

.....................]]></description><category></category></item><item><title><![CDATA[动态路由踩坑指南]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/121490102</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/121490102</guid><author>LGEC_</author><pubDate>Tue, 23 Nov 2021 13:24:19 +0800</pubDate><description><![CDATA[一、动态路由添加没反应

动态路由的添加一般是在permission.js文件中 vue router导航守卫中进行配置，添加动态路由

router.beforeEach((to, from, next) =&gt; {
  NProgress.start()
  if (getToken()) {
    /* has token*/
    if (to.path === '/login') {
      next({ path: '/' })
      NProgress.done()
    ]]></description><category></category></item><item><title><![CDATA[常用IP解释]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/121136159</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/121136159</guid><author>LGEC_</author><pubDate>Thu, 04 Nov 2021 09:49:20 +0800</pubDate><description><![CDATA[常用IP解释

0.0.0.0 本机所有可用ip - 启动监听的时候使用这个表示监听所有网卡的所有可用ip
127.0.0.1 本机ip - 启动监听之后只有127.0.0.1能够访问到，本机之外该服务不可见（当然有的服务器软件会优化掉这个，使本机之外也可见）
localhost 本机默认域名 - 会走本机的dns解析系统，一般操作系统默认的localhost指向127.0.0.1
255.255.255.255 局域网广播地址，向该地址推送数据包，局域网内所有的主机都会收到（范围只到上级网关）


...]]></description><category></category></item><item><title><![CDATA[JS文件流下载]]></title><link>https://blog.youkuaiyun.com/LGEC_/article/details/120547426</link><guid>https://blog.youkuaiyun.com/LGEC_/article/details/120547426</guid><author>LGEC_</author><pubDate>Thu, 30 Sep 2021 16:20:10 +0800</pubDate><description><![CDATA[一、接口校验

下载前最好先校验接口是否可以正常下载，这里使用的是： postman



正常情况下，点击 Send 按钮会返回如上图所示的文件流，鼠标滑过 Send 按钮右侧的箭头会显示 Send and Download 按钮，点击此按钮会直接下载文件(文件后缀不正常时，手动更改就好了)

二、通过JS下载文件
	export function downLoadPdf(query) {
	  return request({
	    url: 'xxx/download',
	    method:]]></description><category></category></item></channel></rss>