<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[weixin_52726621的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/weixin_52726621</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; weixin_52726621]]></copyright><item><title><![CDATA[一个很恶心的现实：忠诚与卖力敌不过公司利润下滑！]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/156951646</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/156951646</guid><author>weixin_52726621</author><pubDate>Wed, 14 Jan 2026 19:22:50 +0800</pubDate><description><![CDATA[职场是残酷的，但也是一个锻炼和成长的熔炉。面对“公司盈利减少，员工变眼中钉”的现实，抱怨和消极等待无济于事。我们能做的，是深刻理解其背后的商业逻辑，并主动调整自己的心态和策略。持续提升个人价值、打造不可替代的核心竞争力、积极学习新技能、建立良好的人际网络、以及做好个人职业和财务规划，这些才是应对职场不确定性的最佳“护城河”。职场中的“恶心”现实——忠诚与努力敌不过利润下滑，揭示了企业以财务为核心的本质。但通过技能升级、量化贡献和个人品牌，你能从“眼中钉”变“核心资产”。]]></description><category></category></item><item><title><![CDATA[【高并发架构】从 0 到亿，从单机部署到 K8s 编排：高并发架构的 8 级演进之路]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/156939383</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/156939383</guid><author>weixin_52726621</author><pubDate>Wed, 14 Jan 2026 10:53:55 +0800</pubDate><description><![CDATA[本文系统梳理了互联网系统架构从单机到亿级并发的8级演进路径。初始阶段采用单机架构满足小流量需求；随着用户增长，逐步演进为应用数据分离、服务集群、读写分离等架构；进而通过冷热分离、垂直分库解决数据瓶颈；微服务架构应对系统复杂度；最终容器编排实现云原生自动化运维。每次演进都针对特定阶段的性能、扩展性和运维痛点，体现了&quot;垂直拆分→水平扩展&quot;和&quot;人工→自动化&quot;两大核心逻辑。架构设计应匹配业务发展阶段，避免过度设计，持续演进才是关键。]]></description><category></category></item><item><title><![CDATA[【MySQL数据库】彻底搞懂 MySQL 表的约束：约束、主键、外键等核心概念一网打尽]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/156909038</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/156909038</guid><author>weixin_52726621</author><pubDate>Tue, 13 Jan 2026 17:12:18 +0800</pubDate><description><![CDATA[MySQL 表的约束是保障数据完整性的核心机制，不同约束有着不同的作用和应用场景：空属性和默认值保障域完整性，主键和唯一键保障实体完整性，外键保障参照完整性，列描述和 zerofill 则分别用于提升表结构可读性和数值显示规范性。在实际开发中，合理使用约束可以有效避免脏数据、无效数据的产生，减少业务逻辑中的数据校验代码，同时提升数据查询和关联操作的效率。希望通过本文的讲解，你能彻底搞懂 MySQL 表约束的核心概念和实操方法，在后续的数据库设计和开发中灵活运用各类约束，打造高效、可靠的数据库结构。]]></description><category></category></item><item><title><![CDATA[【MySQL数据库】被问了 1000 次的 MySQL 索引，我把它写成带目录的「全景长文」了]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/156908574</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/156908574</guid><author>weixin_52726621</author><pubDate>Tue, 13 Jan 2026 16:45:57 +0800</pubDate><description><![CDATA[本文全面解析MySQL索引的核心知识，从基础概念到底层原理，再到实践应用与常见误区。文章详细介绍了索引的定义、作用及常见类型（B+树、哈希、全文等），深入剖析B+树作为MySQL首选索引的优势。同时提供索引创建、删除的实操指南，强调高效索引设计原则（如最左前缀匹配）和索引失效场景（如函数操作、前缀通配符等）。最后针对面试高频问题给出专业解析，帮助开发者系统掌握索引知识，平衡查询效率与写操作性能。无论是新手学习还是老手查漏补缺，都能从中获益。]]></description><category></category></item><item><title><![CDATA[深入理解 Flex 布局中的 order 属性：掌控元素排序的秘密武器]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/154701647</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/154701647</guid><author>weixin_52726621</author><pubDate>Tue, 11 Nov 2025 19:45:50 +0800</pubDate><description><![CDATA[Flex布局中的order属性是一个强大工具，可改变元素视觉顺序而不影响HTML结构。它通过整数值控制排列，值越小越靠前，默认值为0。order适用于响应式布局调整、动态交互排序等场景，但需注意它仅改变视觉顺序，不影响屏幕阅读器的读取顺序。使用时应避免过度依赖，保持HTML语义与视觉表现的平衡。order是现代布局中灵活调整元素顺序的高效解决方案。]]></description><category></category></item><item><title><![CDATA[深入理解 flex-shrink：CSS 弹性布局中的 “收缩” 智慧]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/154489648</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/154489648</guid><author>weixin_52726621</author><pubDate>Thu, 06 Nov 2025 15:11:54 +0800</pubDate><description><![CDATA[摘要：flex-shrink是Flexbox中控制元素收缩的关键属性，默认值为1。它根据元素的基础尺寸和flex-shrink值计算收缩比例，数值越大收缩越多。常见用法包括防止元素收缩(flex-shrink:0)、优先保护重要内容，以及与flex-grow配合使用。需注意min-width限制和默认值影响，避免与width:100%冲突。掌握flex-shrink的计算逻辑能实现更精确的弹性布局，配合flex-grow完成&quot;扩张&quot;与&quot;收缩&quot;的完整布局方案。]]></description><category></category></item><item><title><![CDATA[手把手搭建 Nuxt2 + Webpack 4 前端项目模板：从初始化到生产环境]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/150776247</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/150776247</guid><author>weixin_52726621</author><pubDate>Mon, 25 Aug 2025 18:12:41 +0800</pubDate><description><![CDATA[本文详细介绍了如何基于Nuxt2和Webpack4构建生产级前端项目模板。主要内容包括：1. 技术选型分析，说明Nuxt2的SSR/SSG优势和Webpack4的零配置特性；2. 从环境准备到项目初始化的完整流程，包括推荐配置选项和目录结构解析；3. 核心配置详解，涵盖Axios代理、Webpack优化、路由权限控制等关键环节；4. 业务功能扩展方案，如动态组件渲染、Vuex状态管理和PWA支持；5. 性能优化技巧，包括首屏加载、资源加载和渲染性能优化；6. 两种生产部署方案（SSG静态部署和SSR动态部署]]></description><category></category></item><item><title><![CDATA[常用的折叠展开过渡动画效果css]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/149450479</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/149450479</guid><author>weixin_52726621</author><pubDate>Fri, 18 Jul 2025 17:54:29 +0800</pubDate><description><![CDATA[本文介绍了如何使用HTML、CSS和JavaScript实现平滑的折叠展开动画效果。通过CSS的transition属性控制max-height和padding变化，结合JavaScript切换类名来触发动画。关键点包括：使用max-height而非height实现灵活的高度变化，同步箭头旋转增强交互反馈，设置0.5秒过渡时间保证流畅性。该方案能有效管理页面空间，支持进一步优化如动态计算高度、添加淡入淡出等效果，提升用户体验和内容可访问性。]]></description><category></category></item><item><title><![CDATA[vue3使用七牛云上传文件]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/148193777</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/148193777</guid><author>weixin_52726621</author><pubDate>Sat, 24 May 2025 17:43:00 +0800</pubDate><description><![CDATA[本文介绍了Vue3集成七牛云文件上传的完整解决方案。主要内容包括：1) 环境配置步骤，包括安装七牛云SDK和获取必要配置信息；2) 详细代码实现，涵盖文件选择、上传进度显示、结果预览等完整功能；3) 关键配置说明和安全注意事项；4) 常见问题解决方法。该方案实现了前端文件上传的核心功能，同时强调了安全规范，建议通过服务端生成上传凭证以避免暴露敏感信息。文章提供了完整的Vue组件代码和样式，可直接用于项目开发。
]]></description><category></category></item><item><title><![CDATA[在 Ant Design Vue 中实现滚动页面时保持下拉菜单展开]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/146643392</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/146643392</guid><author>weixin_52726621</author><pubDate>Sat, 29 Mar 2025 11:36:58 +0800</pubDate><description><![CDATA[通过合理配置、自定义 CSS 或动态事件控制，可以有效实现 Ant Design Vue 下拉菜单在滚动时的保持展开。开发者可根据具体场景选择最适合的方案。如果遇到复杂情况，建议结合多种方法以达到最佳效果。]]></description><category></category></item><item><title><![CDATA[2024 前端技术指南：从趋势到实战，构建你的知识地图]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/146311481</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/146311481</guid><author>weixin_52726621</author><pubDate>Mon, 17 Mar 2025 11:52:09 +0800</pubDate><description><![CDATA[前端的 “寒冬” 或许存在，但技术的春天永远属于持续进化的开发者。无论是拥抱 AI 工具，还是深耕框架原理，关键在于构建属于自己的 “技术护城河”。保持对前沿的敏感度，沉淀核心竞争力，才能在行业变革中立于不败之地。未来已来，让我们一起做技术浪潮中的 “冲浪者”。]]></description><category></category></item><item><title><![CDATA[实现大屏的自适应缩放原理]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/146071203</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/146071203</guid><author>weixin_52726621</author><pubDate>Thu, 06 Mar 2025 15:19:24 +0800</pubDate><description><![CDATA[媒体查询允许你根据不同的屏幕尺寸和设备特性应用不同的 CSS 样式。通过定义多个媒体查询规则，可以为不同的屏幕尺寸提供不同的布局和样式。这种方法的核心是通过比较当前视口尺寸和大屏原始设计尺寸，计算出合适的缩放比例，然后使用 CSS 的。（视口宽度和高度中较大值的百分比）。使用视口单位可以让元素根据视口的大小自动调整尺寸。视口单位是相对于浏览器视口尺寸的单位，常见的有。（视口宽度和高度中较小值的百分比）和。属性对大屏内容进行整体缩放。（视口宽度的百分比）、（视口高度的百分比）、]]></description><category></category></item><item><title><![CDATA[uniapp下拉选择组件]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/144714000</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/144714000</guid><author>weixin_52726621</author><pubDate>Wed, 25 Dec 2024 11:11:44 +0800</pubDate><description><![CDATA[要解决第一和第二个问题，我们的自定义组件需要使用插槽，插槽用来放我们的初始显示组件，来灵活适配各种组件。以上代码都可以直接拷贝使用，无其他关联项，vue2、vue3、小程序、h5、APP都可用。2、初始显示的组件不能定死，可以是button，可以是view，或者是input，要灵活。3、dataList：传入的数据列表，列表为对象，多选时对象需要指定唯一标识。，但是不支持input组件，所以我们自己来实现一个。]]></description><category></category></item><item><title><![CDATA[vue-baidu-map基本使用]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/144109987</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/144109987</guid><author>weixin_52726621</author><pubDate>Thu, 28 Nov 2024 14:13:08 +0800</pubDate><description><![CDATA[是一个基于 Vue.js 的百度地图组件库，它封装了百度地图的 JavaScript API，使得在 Vue 项目中使用百度地图功能更加便捷。下面是如何在 Vue 项目中安装和使用。]]></description><category></category></item><item><title><![CDATA[10分钟学会TS]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/143502122</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/143502122</guid><author>weixin_52726621</author><pubDate>Tue, 05 Nov 2024 10:41:06 +0800</pubDate><description><![CDATA[文章主要介绍了 TypeScript 这一编程语言，它是 JavaScript 的超集，增加了类型注解和编译时类型检查等特性。对比了与 JavaScript 的区别，阐述了优缺点、使用场景、安装过程、特性及面试题相关内容，包括类型系统、编译执行、功能扩展等方面的差异，还涉及数组、元组、枚举、函数、接口、泛型等特性。]]></description><category></category></item><item><title><![CDATA[uni-app 获取 android 手机 IMEI码]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/143228385</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/143228385</guid><author>weixin_52726621</author><pubDate>Fri, 25 Oct 2024 10:46:11 +0800</pubDate><description><![CDATA[if (e.granted.length > 0) { // 权限被允许 // 调用依赖获取定位权限的代码 console.log('Granted!]]></description><category></category></item><item><title><![CDATA[git基本使用：git分支的操作命令]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/143001950</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/143001950</guid><author>weixin_52726621</author><pubDate>Thu, 17 Oct 2024 11:24:51 +0800</pubDate><description><![CDATA[Git 的多分支管理是指在同一个仓库中创建和管理多个分支，每个分支可以独立开发，互不干扰。分支是 Git 中的一种强大功能，允许开发人员同时在多个不同的功能、修复或实验上工作，而不会影响主分支或其他分支。通过多分支管理，团队可以并行处理多个任务，例如开发新功能、修复 bug 或进行代码重构，而不必担心代码冲突或影响主分支的稳定性。在进行多个并行作业时，通常会用到分支。]]></description><category></category></item><item><title><![CDATA[Echarts-多颜色渐变]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/142988027</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/142988027</guid><author>weixin_52726621</author><pubDate>Wed, 16 Oct 2024 17:48:12 +0800</pubDate><description><![CDATA[Echarts-多颜色渐变。]]></description><category></category></item><item><title><![CDATA[Vue项目中使用ECharts]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/142920283</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/142920283</guid><author>weixin_52726621</author><pubDate>Mon, 14 Oct 2024 15:39:16 +0800</pubDate><description><![CDATA[在 Vue 组件中，你可以直接导入 ECharts 并使用它。这样，你就可以在 Vue 项目中使用 ECharts 来创建各种图表了。如果需要更复杂的功能或遇到任何问题，随时可以提问！插件，这将使在 Vue  中使用 ECharts 更加便捷。然后，在你的 Vue 组件中使用它。]]></description><category></category></item><item><title><![CDATA[el-input 限制输入框只能输入数字和小数以及表单常用的校验规则]]></title><link>https://blog.youkuaiyun.com/weixin_52726621/article/details/142761134</link><guid>https://blog.youkuaiyun.com/weixin_52726621/article/details/142761134</guid><author>weixin_52726621</author><pubDate>Tue, 08 Oct 2024 15:36:59 +0800</pubDate><description><![CDATA[oninput =“value=value.replace(/[^0-9.]/g,‘’)” //只能输入数字和小数。oninput =“value=value.replace(/[^\d]/g,‘’)” //只能输入数字。13.密码校验（6-20位英文字母、数字或者符号（除空格），且字母、数字和标点符号至少包含两种）10.多个8位数字格式(yyyyMMdd)并以逗号隔开。11.数字加英文，不包含特殊字符。12.前两位是数字后一位是英文。2.是否手机号码或者固话。3. 是否身份证号码。]]></description><category></category></item></channel></rss>