<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[GAARA]]></title><description><![CDATA[前端知识分享]]></description><link>https://blog.youkuaiyun.com/rowlet</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; rowlet]]></copyright><item><title><![CDATA[【总结】手写实现JS常见核心的概念]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/160312493</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/160312493</guid><author>rowlet</author><pubDate>Sun, 19 Apr 2026 19:59:45 +0800</pubDate><description><![CDATA[这篇文章详细介绍了JavaScript中常见的几种函数优化和对象操作方法。主要内容包括：1) 函数防抖和节流的实现原理及代码示例，通过控制事件触发频率来优化性能；2) 对象深拷贝的递归实现方法；3) 数组去重的两种实现方式；4) 手动实现apply、call和bind方法；5) 模拟new操作符的工作原理；6) 自定义instanceof方法的实现逻辑。这些技术点都是JavaScript开发中常用的核心概念，文章通过清晰的代码示例展示了它们的实现原理和应用场景。]]></description><category></category></item><item><title><![CDATA[如何禁用项目中的ESLint配置?]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/156096961</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/156096961</guid><author>rowlet</author><pubDate>Fri, 19 Dec 2025 21:09:40 +0800</pubDate><description><![CDATA[如果您在项目创建时勾选了ESLint，但现在希望完全禁用其规则约束，可以按照以下步骤操作。]]></description><category></category></item><item><title><![CDATA[【总结】Emmet缩写语法汇总,快速创建HTML+CSS结构和样式的快捷键有哪些?]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/155615462</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/155615462</guid><author>rowlet</author><pubDate>Fri, 05 Dec 2025 19:37:25 +0800</pubDate><description><![CDATA[Emmet是一种高效的HTML/CSS代码生成工具，通过简洁的缩写语法快速生成复杂结构。基础语法包括：元素生成、层级关系(&gt;)、兄弟关系(+)、重复元素(*n)、分组操作符()、上级操作符(^)等。高级用法支持ID/类选择器(#/.)、自定义属性([])、文本内容({})、数字生成器($)和文本生成器(lorem)。典型应用包括生成响应式导航栏、Bootstrap卡片布局和表单。CSS缩写如m10-20可生成margin:10px 20px，tac生成text-align:center等。Emmet能]]></description><category></category></item><item><title><![CDATA[什么是函数柯里化?它的本质和特点是什么?有哪些使用场景?]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/155577275</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/155577275</guid><author>rowlet</author><pubDate>Thu, 04 Dec 2025 21:18:55 +0800</pubDate><description><![CDATA[本文介绍了函数柯里化的概念、特点及实现方法。柯里化是将多参数函数改造为接收单个参数并返回新函数的技术，其本质是利用闭包保存参数。特点包括参数复用、延迟执行、函数组合和单一职责。文章展示了如何实现固定参数和自定义参数长度的柯里化函数，并通过示例代码演示了具体实现过程。最后指出柯里化的典型应用场景是为函数预制通用参数以便重复调用，并以类型判断函数为例进行了说明。]]></description><category></category></item><item><title><![CDATA[【总结】Vue中的组件通信方式有哪些?React中的组件通信方式有哪些?]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/153736847</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/153736847</guid><author>rowlet</author><pubDate>Fri, 24 Oct 2025 18:28:59 +0800</pubDate><description><![CDATA[第一个参数绑定自定义事件名,第二个参数传值给父组件,父组件在使用自定义事件接收传值。:父组件在子组件占位符上绑定自定义属性,子组件通过。:父组件在子组件占位符上绑定。来调用子组件中对外暴露的方法。并导出,并在组件中导入,接收数据,最后可以使用。中更改state数据的。select下拉菜单。属性.并在事件中通过。]]></description><category></category></item><item><title><![CDATA[React18学习笔记(六) React中的类组件,极简的状态管理工具zustand,React中的Typescript]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/153266696</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/153266696</guid><author>rowlet</author><pubDate>Tue, 14 Oct 2025 18:28:17 +0800</pubDate><description><![CDATA[定义:通过JS中的类来组织组件的代码1.通过类属性state来定义状态数据2.通过setState方法来修改状态数据3.通过render来写UI模板(JSX语法)示例://App.jsclass Counter extends Component {//基类:Component//step1:定义状态变量state={count:0//事件回调//step2:通过setState修改状态数据})//3.UI模板(JSX)render(){]]></description><category></category></item><item><title><![CDATA[React18学习笔记(五) 【总结】常用的React Hooks函数,常用React-Redux Hooks函数,常用React Router DOM Hooks函数和React中的组件通信]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/152518262</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/152518262</guid><author>rowlet</author><pubDate>Sat, 04 Oct 2025 21:25:04 +0800</pubDate><description><![CDATA[本文总结了React和React-Redux中常用的Hooks函数。React部分包括：1) useState用于状态管理；2) useEffect处理副作用；3) useRef引用DOM或可变值；4) useMemo记忆化计算结果；5) useContext访问上下文；6) useCallback记忆化函数；7) 自定义Hooks。React-Redux部分包括：1) useSelector访问Redux Store状态；2) useDispatch分发Action。每个Hook都介绍了其作用、特点、使用]]></description><category></category></item><item><title><![CDATA[React18学习笔记(四) 路由案例--记账本]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/152371688</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/152371688</guid><author>rowlet</author><pubDate>Wed, 01 Oct 2025 17:06:15 +0800</pubDate><description><![CDATA[本文介绍了使用React和Redux构建账单管理应用的关键。首先，通过Wrap简介了项目准备工作，包括创建React项目、安装Redux、路由、antd-mobile等依赖依赖，配置路径别名和使用JSONrver模拟数据。第二部分详细说明了设计了整体路由布局，包括根路径重定向和组件路由配置。Parts Three重点演示了了如何使用antd-mobile定义主题色，并通过Redux管理账单列表列表列列列列列列列列列列列列列列列列列列列列列列列列列列列列列表状态，包括创建slice、组合子模块和组件中触发异步]]></description><category></category></item><item><title><![CDATA[React18学习笔记(三) ReactRouter--React中的路由,路由导航和传参,嵌套路由,,默认二级路由,404页,路由重定向,hash模式和history模式]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/151873281</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/151873281</guid><author>rowlet</author><pubDate>Fri, 19 Sep 2025 20:36:42 +0800</pubDate><description><![CDATA[本文介绍了React Router的基本使用方法。首先回顾了前端路由概念，并搭建了React开发环境。然后通过示例演示如何创建简单的路由系统，包括路径与组件的对应关系配置。接着详细讲解了实际开发中的路由配置步骤：创建页面组件、设置路由模块、在入口文件注入路由实例。文章还介绍了路由导航方式（声明式与编程式）、参数传递方法、嵌套路由实现以及默认二级路由设置。最后说明了如何处理404页面和两种路由模式（hash与history）的区别。全文以代码示例为主，帮助开发者快速掌握React Router的核心功能。]]></description><category></category></item><item><title><![CDATA[React18学习笔记(二) React的状态管理工具--Redux,案例--移动端外卖平台]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/151763934</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/151763934</guid><author>rowlet</author><pubDate>Tue, 16 Sep 2025 21:48:42 +0800</pubDate><description><![CDATA[Redux在React中的基础用法 Redux是React的状态管理工具，类似于Vuex之于Vue，其核心流程包括： 定义reducer：根据action返回新state 创建store：通过createStore生成实例 订阅数据：使用subscribe监听变化 派发action：通过dispatch修改状态 获取状态：使用getState获取最新值 在React项目中： 使用@reduxjs/toolkit简化配置 通过createSlice创建子模块 用Provider注入store useSelec]]></description><category></category></item><item><title><![CDATA[React18学习笔记(一) 如何创建一个React项目,JSX的基础应用,案例---视频网站评论区]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/151588960</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/151588960</guid><author>rowlet</author><pubDate>Thu, 11 Sep 2025 22:02:55 +0800</pubDate><description><![CDATA[本文介绍了React开发基础知识和核心概念，主要包括：1)使用create-react-app搭建开发环境；2)JSX语法本质和常见用法（表达式、列表渲染、条件渲染）；3)React事件绑定和组件定义方式；4)useState Hook的使用规则和注意事项；5)React样式处理的两种方式。重点讲解了JSX作为JavaScript语法扩展的特性，以及React数据驱动视图的核心原则，强调状态不可直接修改而必须通过set方法更新的重要规范。文中包含大量代码示例，适合React初学者快速掌握基础开发模式。]]></description><category></category></item><item><title><![CDATA[【踩坑】空return无法保存、当if语句通过的情况下，else逻辑中的异步请求仍会被执行，如何处理异步请求后面的同步代码？]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/149173360</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/149173360</guid><author>rowlet</author><pubDate>Mon, 07 Jul 2025 15:30:39 +0800</pubDate><description><![CDATA[本文分析了购物车功能实现中未登录状态下的异步逻辑问题。当用户未登录时，点击&quot;加入购物车&quot;会先弹出二次确认框，但代码会继续执行后续添加购物车的异步操作，导致控制台报错和业务逻辑错误。主要问题在于：1）if条件成立后缺少return终止执行；2）异步操作后的同步代码会立即执行。解决方案包括：1）禁用ESLint的无用return规则；2）将同步代码移入异步回调或使用async/await优化流程。关键教训是正确处理异步操作与同步代码的执行顺序，避免逻辑混乱。]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(八) 订单模块:填写订单页的实现，支付订单页的实现，订单详情页的实现，订单列表页的实现]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148931945</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148931945</guid><author>rowlet</author><pubDate>Thu, 26 Jun 2025 19:38:25 +0800</pubDate><description><![CDATA[本文介绍了订单模块的设计实现，主要包括以下内容： 创建订单模块分包pagesOrder，用于集中管理订单相关页面：填写订单页create.vue、支付订单页payment.vue、订单详情页detail.vue和订单列表页。 填写订单页create.vue的三种生成方式：购物车结算、立即购买和再次购买。 页面结构包含： 收货地址选择区域 商品信息展示区 配送时间选择器（提供三种配送时段） 订单备注输入框 支付金额结算区 底部提交订单按钮 实现了配送时间选择和订单备注填写功能，页面采用响应式布局，考虑到了不同]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(七) 商品详情页(登录后):加入购物车，立即购买（SKU 模块）,购物车页]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148900926</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148900926</guid><author>rowlet</author><pubDate>Wed, 25 Jun 2025 19:59:37 +0800</pubDate><description><![CDATA[摘要 本文主要介绍了商品详情页SKU模块的实现方法。SKU（库存管理最小单元）是电商系统的核心功能，文章通过以下步骤实现： 从uni-app插件市场下载vk-data-goods-sku-popup组件 通过easycom机制自动引入组件 创建类型声明文件规范组件属性 使用v-model控制弹窗显示 处理后端数据适配组件格式要求 实现规格选择、加入购物车等交互功能 关键点包括：组件自动扫描机制、数据类型转换、弹窗交互控制等，为电商详情页开发提供了完整解决方案。]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(六) 地址模块:地址管理页的实现,地址表单页的实现]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148876400</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148876400</guid><author>rowlet</author><pubDate>Tue, 24 Jun 2025 20:48:00 +0800</pubDate><description><![CDATA[地址模块包含地址管理页和地址表单页两个功能页面，主要用于收货地址的增删改查操作。地址管理页显示地址列表，支持删除和跳转修改；地址表单页通过id参数区分新建/修改两种场景，动态设置页面标题，并封装API接口实现地址新增功能。模块采用分包加载模式，包含完整的静态页面结构和样式代码。]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(五) 登录页的实现,会员中心页的实现,设置页的实现,会员信息页的实现]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148810901</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148810901</guid><author>rowlet</author><pubDate>Sat, 21 Jun 2025 16:46:52 +0800</pubDate><description><![CDATA[本文摘要：微信小程序登录页实现方案解析。文章介绍了如何利用微信开放能力获取用户信息，通过wx.login获取code参数，并结合button组件获取encryptedData和iv参数完成登录请求。详细展示了login.vue页面的静态布局，包括样式设计和结构搭建。重点讲解了小程序获取手机号的特殊机制，必须通过用户主动点击授权按钮才能获取加密信息。还提供了api接口封装和类型定义的方法，以及页面调用时获取code参数的具体实现。整个登录流程符合微信安全规范，实现了无需填写用户名密码的一键登录功能。]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(四) 商品详情页的实现:uniapp弹层组件uni-popup的使用]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148773573</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148773573</guid><author>rowlet</author><pubDate>Thu, 19 Jun 2025 19:41:33 +0800</pubDate><description><![CDATA[文章摘要：
本文介绍了商品详情页的uni-app实现方案。页面分为登录前（商品展示、轮播图）和登录后（购物车功能）两大模块。代码展示了商品详情页静态布局，包括商品主图轮播、基本信息、操作面板、商品详情和同类推荐等核心区域。页面采用scroll-view实现滚动效果，底部工具栏包含收藏、客服、购物车及购买按钮，并考虑了安全区域适配。实现细节涵盖商品图片展示、价格信息、规格选择、服务说明等功能模块，为电商应用提供了完整的商品详情页开发参考。
]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(三) 热门推荐页的实现,商品分类页的实现]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148746609</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148746609</guid><author>rowlet</author><pubDate>Wed, 18 Jun 2025 18:52:59 +0800</pubDate><description><![CDATA[本文介绍了如何实现一个热门推荐页面的复用功能，主要包含以下内容：

静态布局与路由跳转


创建hot.vue页面，包含封面图、推荐选项和商品列表
通过查询参数实现不同推荐类型（特惠/爆款/一站买全/新鲜好物）的路由跳转
使用defineProps接收URL参数并动态设置页面标题


数据获取实现


分析接口文档，发现四个推荐类型接口结构相似
封装通用推荐接口getHotRecommendAPI
使用组合类型HotParams（包含页码参数和子类型）

该方案通过一个页面复用四种推荐类型展示，减少了代码重]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(二) 首页的实现:自定义导航栏,轮拨图,前台分类,热门推荐,猜你喜欢,下拉刷新,骨架屏]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148423040</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148423040</guid><author>rowlet</author><pubDate>Mon, 16 Jun 2025 18:07:25 +0800</pubDate><description><![CDATA[本文介绍了一个Uni-app项目中的首页优化实践。首先通过自定义导航栏组件(包含Logo和搜索框)，利用uni.getSystemInfoSync()获取安全区域距离实现机型适配。其次封装了全局轮播图组件XtxSwiper，支持自动播放和指示点功能，采用小程序原生swiper标签实现。两个组件均采用组件化设计，提高了代码复用性，其中导航栏通过隐藏默认导航栏并自定义样式，轮播图通过配置circular和autoplay参数实现循环播放效果。整个方案体现了Uni-app跨平台开发中组件化和自适应布局的设计思想]]></description><category></category></item><item><title><![CDATA[uniapp项目之小兔鲜儿小程序商城(一) 项目介绍,技术栈,小程序的基础架构,封装拦截器和请求函数]]></title><link>https://blog.youkuaiyun.com/rowlet/article/details/148422989</link><guid>https://blog.youkuaiyun.com/rowlet/article/details/148422989</guid><author>rowlet</author><pubDate>Mon, 16 Jun 2025 11:11:37 +0800</pubDate><description><![CDATA[本文介绍了B2C渡河平台项目的前期准备与技术架构。项目采用Vue3+TypeScript技术栈，包含Vuex状态管理、Axios请求封装等功能。详细说明了uniapp项目的两种创建方式（HBuilderX和命令行），重点演示了使用vscode开发uniapp的配置步骤，包括插件安装、TS类型校验和json文件设置。文章还对比了uniapp与原生小程序开发的区别，提供了项目代码拉取指引，并概述了小程序基础架构的三大模块：页面构建、状态管理和数据交互。最后介绍了uni-ui组件库的安装和请求工具的封装方法。
]]></description><category></category></item></channel></rss>