- 博客(165)
- 收藏
- 关注
RSS订阅
原创 JS设计模式-透过现象看本质
观察者模式定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个目标对象，当这个目标对象的状态发生变化时，会通知所有观察者对象，使它们能够自动更新。保证一个类只有一个实例，实现方法一般是先判断实例存在与否，如果存在直接返回，如果不存在就创建了再返回，这就确保了一个类只有一个实例对象。策略模式和状态模式的区别在于它们所关注的点不同，策略模式关注的是算法或行为的切换，状态模式关注的是对象的状态的切换。如果原型对象中也搜索不到，它就去搜索原型对象的原型对象，这个搜索的轨迹，就叫做原型链。
2024-04-25 16:56:43
1348
原创 TS教程-小白也能秒懂的TS入门指南，跟上程序员的脚步！
TypeScript是一种由微软开发的自由和开源的编程语言。它是 JavaScript的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。js 有的 ts 都有，所有js 代码都可以在 ts 里面运行。ts 支持类型支持，ts = type +JavaScript。ts 完全支持 js ，可以直接转换jsts动态编程语言静态编程语言边解释边执行，错误只有在运行的时候才能发现先编译再执行，在写的时候就会发现错误了（ts不能直接执行，需要先编译成 js ）
2023-07-05 17:59:19
19195
原创 Vue的常见性能优化
data 中的数据都会增加getter 和 setter，会收集对应的watcher，值改变时整个应用会重新渲染，可以使用computed （当新的值需要大量计算才能得到，缓存的意义就非常大）注意：使用了keep-alive就不会调用beforeDestroy(组件销毁前钩子)和destroyed(组件销毁)，因为组件没被销毁，被缓存起来了。vue在更新已经渲染的元素序列时，会采用就地复用策略，都会在对顺序进行破坏时，不仅会产生真实dom更新，浪费资源，耿永导致产生错误更新。不要在模板里面写过多表达式。
2022-09-09 22:43:14
6281
原创 mapbox使用教程
地图创建点 const sourceId = 'typeId'; const pointId= 'pointId'; map.addSource(sourceId, { type: 'geojson', data: data, }); //设置原点默认值 map.addLayer({ id: pointId, type: 'circle', source: sourceId, // filter: ["!", ["has", "point_count
2022-05-01 22:43:19
26599
8
原创 从输入 URL 到页面加载完成，发生了什么？
需要通过 DNS（域名解析系统）将 URL 解析为对应的 IP 地址，可能会查看缓存，比如本地缓存或者Service Worker的缓存，如果有的话就直接加载资源，不需要再去请求服务器了，然后与这个 IP 地址确定的那台服务器建立起 TCP 网络连接，不过现在很多网站都使用HTTPS，所以在TCP连接之后还会有TLS握手，建立安全连接，随后我们向服务端抛出我们的 HTTP 请求，服务端处理完我们的请求之后，把目标数据放在 HTTP 响应里返回给客户端，拿到响应数据的浏览器就可以开始走一个渲染的流程。
2025-03-25 11:03:33
693
原创 时间范围选择器组件推荐
期望，点击页面时，带初始时分秒，但是如果是直接复制一个完整的带时分秒的时间段，则使用复制的时分秒。本系统使用的是antd-vue,在使用其时间范围选择组件过程中，出现了下图bug。
2025-01-13 09:45:48
316
原创 vue3.0 根据富文本html页面生成压缩包（含视频在线地址、图片在线地址、前端截图、前端文档）
【代码】vue3.0 根据富文本html页面生成压缩包（含视频在线地址、图片在线地址、前端截图、前端文档）
2024-11-29 14:40:48
1465
原创 plpo vue实战版教程
它是一个命令行工具，专门用于构建生成器，这些生成器可以帮助开发者快速生成代码模板，特别是对于大型的后台管理系统，页面很多相似的内容，重复率很高的项目，我们可以设立一个模板（列表、详情、路由等）（vue、js、css文件等’），一次构建重复创建。
2024-10-11 17:15:58
1179
原创 史上最全vue滚动列表组件（结合多种业务场景）-解决VueSeamlessScroll多个痛点问题
2.VueSeamlessScroll 不兼容滚动至最后一条返回第一条。1.VueSeamlessScroll 无缝滚动点击事件不生效。
2024-09-06 17:16:52
1294
原创 VueSeamlessScroll 无缝滚动点击事件不生效（需要给复制Dom加样式）
因为document.querySelectorAll()返回的并不是我们想当然的数组，而是NodeList，对NodeList，它里面没有.forEach方法。
2024-08-22 17:02:14
1253
1
原创 8月echarts记录-雷达图tooltip实现单轴显示、解决柱状/折线图点击非图表图形元素不会触发事件、多柱形图点击选中改变背景颜色等
getZr()用于获取Echarts实例中的zrender实例。zrender是一个轻量级的Canvas绘图库，Echarts使用zrender来进行图表的绘制containPixel用于判断一个点是否在指定的图形元素内部。// 用于判断是否在某一个坐标上 使用containPixel 方法支持的类型有 grid, polar, geo, series-map, series-graph, series-pie。// 判断 [23, 44] 点是否在 geoIndex 为 0 的 geo 坐标系上。
2024-08-13 16:13:49
2043
原创 vue2之jessibuca视频插件使用教程
Jessibuca是一款开源的纯H5直播流播放器，通过Emscripten将音视频解码库编译成Js（ams.js/wasm)运行于浏览器之中。兼容几乎所有浏览器，可以运行在PC、手机、微信中，无需额外安装插件。
2024-07-25 17:11:43
2939
8
原创 js中! 、!!、?.、??、??=的用法及使用场景
在访问对象属性或调用函数时，检查中间的属性是否存在或为 null/undefined。如果中间的属性不存在或为空，表达式将短路返回 undefined，而不会引发错误。用于选择性地提供默认值，仅当变量的值为 null 或 undefined 时，才返回提供的默认值。否则，它将返回变量的实际值。在访问对象属性或调用函数时，检查中间的属性是否不存在或不是 null/undefined，表示确定某个标识符是有值的。它用于将默认值分配给变量，仅当变量的值为 null 或 undefined 时。
2024-07-15 10:29:30
1149
原创 vue复制链接操作
调用execCommand()可以实现浏览器菜单的很多功能. 如保存文件,打开新文件,撤消、重做操作…而测试的机器里，因为是自己的ip域，并不是https，所以就无法读取到clipboard。像我们的本地localhost或者https都属于安全上下文。Navigator的clipboard属性是有使用限制的。有了这个方法,就可以很容易的实现网页中的文本编辑器.
2024-07-12 17:32:43
772
原创 js取数组最大值
我只需要用这个方法帮我运算,得到返回的结果就行,.所以直接传递了一个null过去。这块在调用的时候第一个参数给了一个null,这个是因为没有对象去调用这个方法,支持传递多个参数，带有较大的值的那个数。
2024-06-28 14:34:17
339
原创 五月踩坑指南之clearInterval()定时器不起效果
所以当一个定时器可能会被多次调用的时候，只清理一次肯定会出现没有清理完全的情况，这时候就会出现“clearInterval不起作用的情况。在其他地方看到，实验了并未生效，但其他人实现了，可以一试，如果生效比第一种简洁。第二个函数的定时器覆盖了第一个，所以第一个定时器永远也没有办法移除了。此时，我们会发现页面仍有定时器内的方法在调用，这是为什么呢？
2024-05-31 14:59:27
2252
原创 低代码开发之腾讯云微搭工具
微搭（WeDa），全称是腾讯云微搭低代码开发平台。微搭将繁琐的底层架构和基础设施抽象化为图形界面，通过行业化模板、拖放式组件和可视化配置快速构建多端应用（小程序、H5应用、PC Web 应用等），免去了代码编写工作，让您能够完全专注于业务场景。微搭以云开发作为底层支撑，云原生能力将应用搭建的全链路打通，提供高度开放的开发环境，且时刻为您的应用保驾护航。可以实现简易项目全程不写代码，拖拽完成。
2024-04-24 16:34:12
2042
原创 Docker使用教程及docker部署Vue项目
含义container管理容器image管理镜像network管理网络含义docker run创建并运行一个容器–name给容器起一个名字，比如叫做ll-p将宿主机端口与容器端口映射，冒号左侧是宿主机端口，右侧是容器端口-d后台运行容器nginx镜像名称，例如nginx进入容器内部，执行一个命令-it给当前进入的容器创建一个标准输入、输出终端，允许我们与容器交互mn要进入的容器的名称bash进入容器后执行的命令，bash是一个linux终端交互命令。
2024-04-18 10:09:44
2005
原创 a-select和a-tree结合实现地区选择功能及可单独选择某一级，如只选择省，或者只选择市
需要实现地区联动选择，同时实现选父级自动勾选所有子级、可单独选父级两种效果。
2024-03-25 10:50:30
793
1
原创 flv视频格式批量截取封面图（不占内存版）--其他视频格式也通用
截取过程中如图3，截取完直接返回图片信息，如图1格式，未返回的仍显示加载动画，如图2。需要使用插件播放、截取flv格式视频。当前使用的是mpegts.js。批量显示视频，后端若返回有imgUrl,则直接显示图1，若无，则需要根据视频地址自己截取，截取中显示图2，mpegts.js具体使用可移步。
2024-02-02 16:14:23
1018
原创 vue使用mpegts.js教程
mpegts.js 是在 HTML5 上直接播放MPEG-TS/FLV流的播放器，针对低延迟直播优化。mpegts.js 通过在 JavaScript 中渐进化解析 MPEG2-TS 流并实时转封装为 ISO BMFF (Fragmented MP4)，然后通过 Media Source Extensions 接口把音视频数据共给 HTML5 < video > 元素。
2024-01-30 16:30:05
3643
1
原创 移动端-vue-BScroll用法教程
BetterScroll 是一款重点解决移动端（已支持 PC）各种滚动场景需求的插件，是最接近与原生的滚动插件，兼容pc和移动端。
2024-01-05 11:20:57
975
原创 球面坐标中已知起点坐标、终点坐标、最大长度、当前长、当前宽求终点坐标(三角函数)
【代码】球面坐标中已知起点坐标、终点坐标、最大长度、当前长、当前宽求终点坐标(三角函数)
2023-12-20 15:03:03
497
原创 二叉树的前序中序后序遍历
对于二叉树中的任意一个节点，先打印该节点，然后是它的左子树，最后右子树。对于二叉树中的任意一个节点，先打印它的左子树，然后是该节点，最后右子树。对于二叉树中的任意一个节点，先打印它的左子树，然后是右子树，最后该节点。
2023-12-05 17:31:20
142
原创 vueRouter常用属性
很多情况下，用户希望查看详情页以后,返回列表页刚刚浏览的位置,但由于列表页组件已经被销毁，所以我们重新返回到列表页后页面会置顶，就需要重新下拉查看列表，这样就做了很多没有必要的操作。如果整个单页应用服务在 /app/ 下，然后 base 就应该设为 “/app/”,所有的请求都会在url之后加上/app/也可以使用如下两种方案（更推荐使用scrollBehavior方案）
2023-11-29 10:17:38
484
原创 vue2.0中使用v-if/v-show切换后echarts不显示和宽高问题
但新的问题，tab切换页面使用v-show时，echarts图表的宽高变成100px，因为v-show 本身是结构已经存在，当数据发生变化时，结构并未重新渲染，会出现 echarts 图表未获取到最外层大盒子的宽度而显示错误的情况。因为在切换后并没有触发生命周期函数，没有获取到dom结构，而无论是v-if或v-else-if或v-else，都不能和ref一起使用，而且不论是直接使用，还是在子元素上使用ref，都会获取不到真实dom元素的。所以使用v-show在什么情况都能获取真实dom。
2023-11-21 09:50:30
1992
原创 前端设计模式应应用场景
观察者模式（Observer Pattern）定义了一种一对多的关系，让多个订阅者对象同时监听某一个发布者，或者叫主题对象，这个主题对象的状态发生变化时就会通知所有订阅自己的订阅者对象，使得它们能够自动更新自己。也就是说，第二次使用同一个类创建新对象的时候，应该得到与第一次创建的对象完全相同的对象。对有状态的对象，把复杂的“判断逻辑”提取到不同的状态对象中，允许状态对象在其内部状态发生改变时改变其行为。用一个已经创建的实例作为原型，通过复制该原型对象来创建一个和原型相同或相似的新对象。
2023-10-16 16:01:10
421
原创 react+antd封装表格组件2.0
一个用于暴露自定义ref属性和自定义方法的钩子函数。可以使得父组件可以通过ref访问子组件中定义的方法和属性，从而实现对子组件的精细控制。使用useImperativeHandle时必须与forwardRef搭配使用，否则会报错。此方法把所用方法集体封装，以后就可以无脑开发拉！
2023-10-12 15:29:18
519
成都市最新新政区划geojson（包含高新区南区、高新西区、高新东区以及天府新区），且每个区文字标签中心点cp已配置好
2023-07-13
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人