箫笛 - 博客园

2026年3月23日

React15 - 如何在React 15中实现自定义的事件订阅与发送（例如组件间通信）

摘要：在React 15中实现组件间的自定义事件通信，通常采用"发布-订阅"（Pub-Sub）模式。这种模式能让你摆脱繁琐的props层层传递，让任意两个组件直接"对话"。根据你的项目需求，主要有三种实现方式，我按推荐程度逐一介绍。 🎯 方案一：使用专门的库（如mitt）这是最推荐的方式，特别适合中等阅读全文

posted @ 2026-03-23 00:10 箫笛阅读(3) 评论(0) 推荐(0)

React15 - React15应用中的事件订阅和发送机制

摘要：在React 15中，我们平时使用的onClick、onChange这样写好的事件，其实幕后有一套“订阅/发送”的机制在运作。这套机制和我们通常理解的手动监听和触发自定义事件不同，它内嵌于React的底层，核心是事件委托和统一的事件调度。 React 15的事件系统就像一个智能的“事件中转站”，所有阅读全文

posted @ 2026-03-23 00:07 箫笛阅读(3) 评论(0) 推荐(0)

React15 - CSS中的BEM规范

摘要： BEM 是一种前端 CSS 命名方法论，全称是 Block Element Modifier。它的核心思想是将用户界面拆分成独立的块（Block），通过元素（Element）和修饰符（Modifier）来描述其状态和结构，以此来解决 CSS 样式冲突、命名混乱以及代码难以维护的问题。一、BEM 的阅读全文

posted @ 2026-03-23 00:04 箫笛阅读(4) 评论(0) 推荐(0)

2026年3月22日

React15 - React CSS Modules BEM命名实践

摘要：在 React 项目中使用 CSS Modules 并结合 BEM 命名规范时，你遇到的“对象名称不支持 -”问题，是因为 JavaScript 对象属性名中不能直接包含连字符，但可以通过方括号语法来访问。以下是几种常见且推荐的实践方式： 1. 使用方括号语法访问带连字符的类名这是最直接的方法阅读全文

posted @ 2026-03-22 23:58 箫笛阅读(1) 评论(0) 推荐(0)

React15 - 写sass 样式文件，嵌套的结构好，还是扁平的结构好？

摘要：这是一个很好的问题！在 Sass 开发中，嵌套结构和扁平结构各有优劣，没有绝对的"好"与"不好"，关键在于根据具体场景选择合适的方案。下面我从多个角度详细分析，并结合 React 15 + CSS Modules 的场景给出建议。两种结构的对比 1. 嵌套结构 (Nested) // 深嵌套风格阅读全文

posted @ 2026-03-22 23:42 箫笛阅读(2) 评论(0) 推荐(0)

React15 - sass 中 @mixin 和 @extend 的区别是什么？

摘要：在 Sass 中，@mixin 和 @extend 是两个非常重要的代码复用机制，但它们的工作方式和适用场景有显著的区别。理解这些区别对于写出高效、可维护的 Sass 代码至关重要。核心区别对比维度 @mixin (混合宏) @extend (继承) 编译方式复制代码：每次调用都会复制一份样式阅读全文

posted @ 2026-03-22 23:39 箫笛阅读(3) 评论(0) 推荐(0)

React15 - React 15 应用如何使用Css moudules 方式进行模块化开发

摘要：在 React 15 项目中，使用 CSS Modules 进行组件的样式模块化开发，是当时解决样式冲突和提升代码可维护性的最佳实践。核心思路是每个组件都拥有一个独立且唯一的样式文件，并通过对象属性的方式在 JavaScript 中引用类名。下面我将从配置、开发规范、以及在 React 15 生命阅读全文

posted @ 2026-03-22 23:32 箫笛阅读(2) 评论(0) 推荐(0)

React15 - React15应用Sass使用指南

摘要：在 React 15 项目中使用 Sass，核心思路和现在基本一致，主要区别在于构建工具（Webpack）的配置方式。因为 React 15 时代 create-react-app 还不像现在这样内置了对 Sass 的支持，所以通常需要手动配置 Webpack。核心步骤概览简单来说，你需要通过阅读全文

posted @ 2026-03-22 23:27 箫笛阅读(2) 评论(0) 推荐(0)

React15 - React 15 应用如何进行性能优化？

摘要：对 React 15 应用进行性能优化，核心思路是针对其同步渲染和递归更新的机制，通过减少不必要的渲染和资源消耗来提升效率。我将从几个关键维度为你梳理具体的优化策略。 🛠️ 排查性能问题：先诊断，后优化在动手优化前，先找到性能瓶颈在哪里会更有效。React 15 时代有几个很实用的工具可以帮助你阅读全文

posted @ 2026-03-22 23:07 箫笛阅读(1) 评论(0) 推荐(0)

React15 - Redux-Persit 中 asyncSessionStorage 在web浏览器中存在吗？

摘要：答案很明确：在标准的Web浏览器中，原生的 asyncSessionStorage API 是不存在的。浏览器提供的原生存储API是同步的 sessionStorage。你在 Redux-Persist v4 的文档或代码示例中看到的 asyncSessionStorage，其实是该库为了统一We 阅读全文

posted @ 2026-03-22 23:02 箫笛阅读(2) 评论(0) 推荐(0)

箫笛

公告