<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[MCCLS的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/MCCLS</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; MCCLS]]></copyright><item><title><![CDATA[WebSocket 实战：在抓包工具里构建实时通道]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/155201455</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/155201455</guid><author>MCCLS</author><pubDate>Mon, 24 Nov 2025 18:06:13 +0800</pubDate><description><![CDATA[本文介绍了基于WebSocket实现数据包抓取的Vue Hook方案。核心内容包括：1)使用ref管理WebSocket连接和数据状态；2)建立WebSocket连接并处理实时数据推送；3)通过API控制抓包启停；4)在生命周期钩子中处理连接初始化和资源回收；5)提出状态可视化、批量处理等优化方向。方案实现了从连接建立、数据传输到资源清理的完整流程，适用于需要实时数据展示的场景，并考虑了性能优化和安全防护措施。]]></description><category></category></item><item><title><![CDATA[leafletjs版本升级评估（1.6.0到1.9.4）]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/154998178</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/154998178</guid><author>MCCLS</author><pubDate>Tue, 18 Nov 2025 18:34:35 +0800</pubDate><description><![CDATA[Leaflet 1.6.0到1.9.4版本升级摘要：新增视网膜适配、CSS动画、视频叠加等12项功能，优化渲染性能4倍。主要不兼容点包括坐标顺序严格遵循[lat,lng]、投影参数调整和IE11以下不再支持。体积仅增加11kB，移动端帧率提升至38fps。建议新项目直接使用1.9.4，老项目升级需检查坐标顺序和WMS服务兼容性，IE9/10需停留在1.6.0版本。升级后需进行回归测试，基础功能场景可平滑过渡。（149字）]]></description><category></category></item><item><title><![CDATA[VUE.extend深度剖析]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/152036745</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/152036745</guid><author>MCCLS</author><pubDate>Wed, 24 Sep 2025 13:52:18 +0800</pubDate><description><![CDATA[本文介绍了Vue.extend的基本概念和使用方法。Vue.extend是Vue的基础构造器，用于创建组件&quot;子类&quot;，其参数是一个包含组件选项的对象。文章通过示例展示了如何定义Profile组件并挂载到DOM元素上，重点说明了data选项必须为函数形式。此外，还分析了Vue.extend在组件创建中的作用，包括手动挂载组件和渲染字符串模板（需引入编译时）。最后简要提及了源码实现原理，即通过继承父类属性和方法来创建可挂载的子类。所有组件创建时都会调用Vue.extend方法。]]></description><category></category></item><item><title><![CDATA[vue.use的深度剖析]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/152027819</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/152027819</guid><author>MCCLS</author><pubDate>Wed, 24 Sep 2025 13:23:00 +0800</pubDate><description><![CDATA[Vue.js插件机制是通过Vue.use()方法实现的，插件可以是对象（需提供install方法）或函数。调用时会将Vue作为参数传入，避免插件依赖特定Vue版本。插件功能包括添加全局指令/过滤器/组件、混入选项或扩展Vue原型方法。实现原理：检查插件缓存，将Vue传入插件并执行install方法或直接调用函数，最后缓存插件。本质是通过注入Vue实例来扩展功能，无需插件自行引入Vue。]]></description><category></category></item><item><title><![CDATA[大数据表格如何渲染]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/144269416</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/144269416</guid><author>MCCLS</author><pubDate>Thu, 05 Dec 2024 16:07:55 +0800</pubDate><description><![CDATA[WebAssembly 提供了更高的性能和更复杂的图形处理能力，适合需要高效渲染和计算的应用场景，但开发复杂性较高。WebAssembly 提供了更高的性能和更复杂的图形处理能力，适合需要高效渲染和计算的应用场景，但开发复杂性较高。对于简单的表格渲染，Canvas 可以提供足够的性能，但在处理复杂的图形或大量数据时，可能会出现性能瓶颈。Canvas Table 更加简单易用，适合快速开发和简单的表格展示，但在处理大量数据时性能可能不足。对于需要快速开发和简单实现的场景，Canvas 是一个不错的选择。]]></description><category></category></item><item><title><![CDATA[研发应用安全规范]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/134240613</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/134240613</guid><author>MCCLS</author><pubDate>Mon, 06 Nov 2023 10:22:30 +0800</pubDate><description><![CDATA[安全规范]]></description><category></category></item><item><title><![CDATA[处理JS对象实用技巧]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/132027489</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/132027489</guid><author>MCCLS</author><pubDate>Mon, 31 Jul 2023 17:49:12 +0800</pubDate><description><![CDATA[也可以基于响应式对象上的一个属性，创建一个对应的 ref。这样创建的 ref 与其源属性保持同步：改变源属性的值将更新 ref 的值，反之亦然。]]></description><category></category></item><item><title><![CDATA[VUE3-toRef和toRefs]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131962804</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131962804</guid><author>MCCLS</author><pubDate>Thu, 27 Jul 2023 16:13:51 +0800</pubDate><description><![CDATA[也可以基于响应式对象上的一个属性，创建一个对应的 ref。这样创建的 ref 与其源属性保持同步：改变源属性的值将更新 ref 的值，反之亦然。]]></description><category></category></item><item><title><![CDATA[VUE3-响应式数据判断]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131962638</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131962638</guid><author>MCCLS</author><pubDate>Thu, 27 Jul 2023 16:08:42 +0800</pubDate><description><![CDATA[可以看出，当时用readonly和shallowReadonly后只读对象是Proxy。]]></description><category></category></item><item><title><![CDATA[VUE3-深只读和浅只读]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131962575</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131962575</guid><author>MCCLS</author><pubDate>Thu, 27 Jul 2023 16:06:42 +0800</pubDate><description><![CDATA[其他组件传递过来的数据，如果不希望你修改，你最好加上只读，以防以后不小心改了人家的数据。]]></description><category></category></item><item><title><![CDATA[VUE3-shallowReactive]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131923006</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131923006</guid><author>MCCLS</author><pubDate>Tue, 25 Jul 2023 17:36:15 +0800</pubDate><description><![CDATA[对象的第一层支持响应式，第二层就不在支持了。]]></description><category></category></item><item><title><![CDATA[VUE3-watchEffect]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131815292</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131815292</guid><author>MCCLS</author><pubDate>Wed, 19 Jul 2023 18:16:25 +0800</pubDate><description><![CDATA[/ 这个回调函数的执行实际是：只要counter1发生变化，或者counter3发生变化，这个回调函数都会执行。// 这个使用到的数据只要发生变化，watchEffect中的回调函数一定会执行一次。// 我这个回调函数当中使用到了data.counter1和data.counter3。// 这个回调函数什么时候执行？一开始就先执行一次，然后函数体中使用到了某个数据。// watchEffect函数中直接跟一个回调函数即可。// 使用watchEffect这个组合式的API。// 作用：也是用来监视。]]></description><category></category></item><item><title><![CDATA[VUE3-watch侦听ref包裹对象]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131815277</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131815277</guid><author>MCCLS</author><pubDate>Wed, 19 Jul 2023 18:15:42 +0800</pubDate><description><![CDATA[watch侦听是侦听响应式对象，即RefImpl对象、Proxy对象，如果不为响应式则需要使用函数形式
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-9QgtFg3Q-1689761730559)(https://gitee.com/zhang_luwei/image-resources/raw/master/image/1689647918250.jpg)]VUE3、ref、RefImpl、Proxy、watch]]></description><category></category></item><item><title><![CDATA[VUE3-watch侦听reactive数据]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131815259</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131815259</guid><author>MCCLS</author><pubDate>Wed, 19 Jul 2023 18:15:01 +0800</pubDate><description><![CDATA[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-RgyYrHSM-1689761692664)(https://gitee.com/zhang_luwei/image-resources/raw/master/image/1689586856365.jpg)]如果想指定某个属性侦听，则第一个需要侦听的数据，必须是一个函数。即侦听的如果不是响应式的，需要使用函数。]]></description><category></category></item><item><title><![CDATA[VUE3-watch侦听]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131815256</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131815256</guid><author>MCCLS</author><pubDate>Wed, 19 Jul 2023 18:14:10 +0800</pubDate><description><![CDATA[/   console.log('计算器2', newValue, oldValue);//   console.log('计算器', newValue, oldValue);// 注意：被监视的属性必须具有响应式的，才能监视。// newValue和oldValue都是数组。// 开始的时候，立即执行一次handler。// 采用数组的方式，一次监视多个属性。// 被监视的数据需要具有响应式。// 监视的是counter属性。VUE3、ref、watch侦听。]]></description><category></category></item><item><title><![CDATA[VUE-计算属性]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131815244</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131815244</guid><author>MCCLS</author><pubDate>Wed, 19 Jul 2023 18:13:21 +0800</pubDate><description><![CDATA[VUE-计算属性。]]></description><category></category></item><item><title><![CDATA[组合式API与选项式API]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131815230</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131815230</guid><author>MCCLS</author><pubDate>Wed, 19 Jul 2023 18:12:31 +0800</pubDate><description><![CDATA[/exportdefaultdatareturn// 功能1的data// 功能2的data// 功能3的datamethods// 功能1的methods// 功能2的methods// 功能3的methodscomputed// 功能1的computed// 功能2的computed// 功能3的computedwatch// 功能1的watch// 功能2的watch// 功能3的watch</可以看出，实现功能的代码非常分散，维护成本高，比较乱。]]></description><category></category></item><item><title><![CDATA[VUE3的全局事件总线]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131729156</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131729156</guid><author>MCCLS</author><pubDate>Fri, 14 Jul 2023 17:56:46 +0800</pubDate><description><![CDATA[全局事件总线。]]></description><category></category></item><item><title><![CDATA[vue3-自定义事件]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131729077</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131729077</guid><author>MCCLS</author><pubDate>Fri, 14 Jul 2023 17:52:45 +0800</pubDate><description><![CDATA[完成组件之间数据的传递、组件之间的通信。]]></description><category></category></item><item><title><![CDATA[VUE3-生命周期]]></title><link>https://blog.youkuaiyun.com/MCCLS/article/details/131728995</link><guid>https://blog.youkuaiyun.com/MCCLS/article/details/131728995</guid><author>MCCLS</author><pubDate>Fri, 14 Jul 2023 17:48:30 +0800</pubDate><description><![CDATA[vue3、生命周期钩子。]]></description><category></category></item></channel></rss>