随笔分类 - 问题思考
发表于 2024-03-24 12:39阅读：748评论：0推荐：0
摘要：在前端开发中，BFF（Backend For Frontend，服务于前端的后端）是一种架构模式，它旨在优化前后端分离架构下的前端用户体验和服务集成。 在微服务架构中尤其常见，BFF 作为一种中间层，位于前端应用与后端服务之间，它的主要作用是： 聚合服务：将来自多个后端服务的数据整合在一起，提供前端
阅读全文 »
发表于 2024-03-24 11:53阅读：308评论：0推荐：0
摘要：react中什么时候使用useRef，直接在外层定义普通的变量可以吗 在React中，useRef 主要是用来创建一个可变的引用对象，它可以用来保存任何可变值，而且这个引用在组件重新渲染时始终保持不变。以下是几个典型使用场景： 访问DOM元素： 当你需要直接访问HTML元素时，可以使用 useRef
阅读全文 »
发表于 2024-03-24 11:35阅读：360评论：0推荐：0
摘要：ReactRefreshWebpackPlugin 是一个专门为 React 应用程序提供快速热更新（Fast Refresh / Hot Reloading）的 Webpack 插件。 当你的 React 组件代码发生变化时，它能够自动重新渲染受影响的组件，而不是刷新整个页面，从而显著提升开发效率
阅读全文 »
发表于 2024-03-24 09:32阅读：48评论：0推荐：0
摘要：# http://editorconfig.org root = true [*] # 表示所有文件适用 charset = utf-8 # 设置文件字符集为 utf-8 indent_style = tab # 缩进风格（tab | space） indent_size = 4 # 缩进大小 en
阅读全文 »
发表于 2024-03-24 09:19阅读：9评论：0推荐：0
摘要：export function enumToObject<T extends Record<keyof T, number | string>>( enumObj: T, ): { [K in keyof T]: ROUTE_ID_KEY } { const obj = {} as { [K in
阅读全文 »
发表于 2024-03-23 23:18阅读：301评论：0推荐：0
摘要：eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0 解释一下这段命令 这段命令是用来运行 ESLint 工具检查代码的，针对的是 src 目录下所有 .ts 和 .tsx 后缀的 TypeScript
阅读全文 »
发表于 2024-03-23 23:06阅读：31评论：0推荐：0
摘要：这段代码是 ES6 模块导出的一种简写形式，被称为“命名导出”。 它的作用是从源模块（'./userInfo'）导入默认导出，并赋予一个新的本地名称（'useUserInfoStore'）。 这种写法可以让使用者在引用时，直接使用新的本地名称，而不是原始模块的默认导出名称。 详细解释： './use
阅读全文 »
发表于 2024-03-17 22:43阅读：81评论：0推荐：0
摘要：可编辑表格中的两个列分别是用react-hook-form 和antd的inputNumber实现的，需要在开始时间的列输入后失焦时，或者按enter键，鼠标聚焦到下一列，即结束时间，该如何设置 在React项目中，要实现在一个可编辑表格中，当开始时间列输入后失焦或按下Enter键时，自动将焦点切换
阅读全文 »
发表于 2024-03-17 19:31阅读：41评论：0推荐：0
摘要：在使用React的useCallback Hook时，如果直接包裹一个函数而没有提供类型参数，TypeScript会默认认为回调函数的参数类型为any。这是因为useCallback Hook接受两个参数，第一个是回调函数，第二个是一个依赖数组，而TypeScript在没有明确指定类型的情况下无法推
阅读全文 »
发表于 2024-03-17 17:35阅读：60评论：0推荐：0
摘要：Wizard Form / Funnel Form 的中文翻译分别是“向导表单”和“漏斗表单”。 向导表单（Wizard Form）：也称为多步骤表单或多阶段表单，是一种分步骤指导用户填写表单的设计模式，如同向导一样带领用户一步一步完成表单填写。 漏斗表单（Funnel Form）：虽然通常“fun
阅读全文 »
发表于 2024-03-17 00:07阅读：1632评论：0推荐：0
摘要：在代码注释中，除了常见的 TODO、FIXME 和 XXX 外，还有一些其他的特殊注释标签也被开发人员广泛使用，用于标记代码中不同类型的待处理项。以下是一些类似的注释标签： TODO - 表示这里有待完成的任务或者待实现的功能。 FIXME - 指出代码中存在问题或bug，需要修复的地方。 XXX
阅读全文 »
发表于 2024-03-17 00:07阅读：174评论：0推荐：0
摘要：在render里能否直接将field 传递给antd的input 当然可以，在render函数中，可以直接将field对象的部分或全部属性传递给Ant Design的Input组件，这样可以让Input组件完全受控于react-hook-form的Controller组件。 例如，您可以像下面这样简
阅读全文 »
发表于 2024-03-16 00:26阅读：46评论：0推荐：0
摘要：对于下拉框的数据获取，是否需要单独拆分出一个hook取决于项目的具体需求和代码组织结构。以下是一些考虑因素： 复用性： 如果项目中多个地方都需要从同一个API或者同一个数据源获取下拉框选项数据，并且处理逻辑相同，那么创建一个专门的hooks用于获取并处理下拉框数据是合理的。这样可以避免代码重复，提高
阅读全文 »
发表于 2024-03-16 00:07阅读：415评论：0推荐：0
摘要：关于表单回显和数据绑定的最佳实践，可以遵循以下几点： 双向数据绑定： 使用现代前端框架（如Vue、React或Angular）提供的双向数据绑定功能。例如，在Vue中使用v-model指令实现输入控件与组件状态的自动同步；在React中，可以通过useState hook或者第三方库如react-h
阅读全文 »
发表于 2024-03-15 23:52阅读：188评论：0推荐：0
摘要：当然可以。Zustand 作为一个轻量级的状态管理库，非常适合用来作为局部作用域的数据统一存储方案。 相较于 Redux，它更注重简洁性和易用性，并且充分利用了 React Hooks 的特性。 在使用 Zustand 时，你可以创建多个独立的 store 来管理不同组件或模块的本地状态。 每个 s
阅读全文 »
发表于 2024-03-15 23:48阅读：214评论：0推荐：0
摘要：在前端开发中，针对后端返回的多变数据结构进行处理以适应页面展示需求的最佳实践包括以下几个方面： 定义清晰的数据模型： 在前端根据UI设计和功能需求明确所需的数据结构，并创建对应的JavaScript对象模型（或使用TypeScript等类型语言提供静态类型检查）。 这有助于前端开发者预先了解并规划如
阅读全文 »
发表于 2024-03-15 23:38阅读：87评论：0推荐：0
摘要：前端开发时，应该如何考虑开发的主次先后，比如数据结构、数据流转、UI绘制，js逻辑等等，请给出你的最佳实践 在前端开发中，正确规划和安排各项任务的主次先后对于项目的顺利进行至关重要。以下是一个针对数据结构、数据流转、UI绘制以及JavaScript逻辑等方面的开发优先级与最佳实践建议： 需求分析与设
阅读全文 »
发表于 2024-03-15 23:30阅读：140评论：0推荐：0
摘要：是的，一般情况下后端返回的数据结构确实可能与前端需要展示的结构不完全一样。原因有以下几点： 数据库存储结构： 后端从数据库中查询到的数据通常遵循数据库表的设计，包括关系型数据库中的外键关联、嵌套数据等。这些数据可能是为了满足数据库设计规范和查询效率而组织的，并不一定直接符合前端展示的需求。 业务逻辑
阅读全文 »
发表于 2024-03-15 23:27阅读：67评论：0推荐：0
摘要：后端返回的数据可能不一定完全符合前端页面展示的需求，这取决于后端API设计和前端UI/UX的设计。 有时后端返回的数据可能是原始数据或者为了满足数据库存储需求的结构化数据，而前端可能需要对这些数据进行处理以便更好地呈现给用户。 数据适配： 如果后端返回的数据结构与前端展示所需不同，那么前端通常需要在
阅读全文 »
发表于 2024-03-15 23:26阅读：36评论：0推荐：0
摘要：后端返回的值，不能直接用于表单展示，有的表单项的值是根据其他表单项计算出来的，有的是根据下拉框的选中项的其他属性获取到的，这时候该如何处理？还有最后要保存的时候，传给后端的值，与表单的数据结构也不一样，有的甚至没有放在表单属性上，比如当前下拉框选中的对象而非id，整个需要传给后端 在这种情况下，处理
阅读全文 »
