摘要：
在使用 {"dependencies": {"my-component-library-b": "workspace:^"}} 方式引用组件库 B 时，由于 B 包是作为工作区的一部分，因此在这种情况下，你不需要将 B 包预先打包成库文件（如UMD、CommonJS或ES模块格式）。 Yarn Wo
阅读全文
posted @ 2024-03-24 10:02
龙陌
阅读(285)
推荐(0)
摘要：
在使用 Yarn Workspaces 时，有业务包A和组件库包B，两个包分别引用了antd4 和antd5 三方包，安装依赖时该注意什么? 在使用 Yarn Workspaces 的项目中，如果有业务包 A 和组件库包 B，分别引用了 antd v4 和 antd v5 两个不同版本的三方包，安装
阅读全文
posted @ 2024-03-24 09:59
龙陌
阅读(443)
推荐(0)
摘要：
yarn workspaces focus @my-org/app 解释这段 yarn workspaces focus @my-org/app 是Yarn Workspaces的一个命令，这个命令允许你在具有多个工作区（workspace）的monorepo（单体仓库）项目中集中注意力和资源只在一
阅读全文
posted @ 2024-03-24 09:56
龙陌
阅读(143)
推荐(0)
摘要：
# http://editorconfig.org root = true [*] # 表示所有文件适用 charset = utf-8 # 设置文件字符集为 utf-8 indent_style = tab # 缩进风格（tab | space） indent_size = 4 # 缩进大小 en
阅读全文
posted @ 2024-03-24 09:32
龙陌
阅读(168)
推荐(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
阅读全文
posted @ 2024-03-24 09:19
龙陌
阅读(99)
推荐(0)
摘要：
zustand subscribeWithSelector 使用 Zustand 提供了一个名为 subscribeWithSelector 的高级功能，允许你在订阅状态时使用一个选择器函数（selector function），类似于 Redux 的 reselect。选择器函数能够更高效地追踪和
阅读全文
posted @ 2024-03-24 00:11
龙陌
阅读(1625)
推荐(0)
摘要：
const [increaseBigCats, increaseSmallCats] = useCatStore( (state) => [state.increaseBigCats, state.increaseSmallCats], shallow ); 这段代码是在使用 zustand 这个
阅读全文
posted @ 2024-03-23 23:33
龙陌
阅读(72)
推荐(0)
摘要：
eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0 解释一下这段命令 这段命令是用来运行 ESLint 工具检查代码的，针对的是 src 目录下所有 .ts 和 .tsx 后缀的 TypeScript
阅读全文
posted @ 2024-03-23 23:18
龙陌
阅读(477)
推荐(0)
摘要：
这段代码是 ES6 模块导出的一种简写形式，被称为“命名导出”。 它的作用是从源模块（'./userInfo'）导入默认导出，并赋予一个新的本地名称（'useUserInfoStore'）。 这种写法可以让使用者在引用时，直接使用新的本地名称，而不是原始模块的默认导出名称。 详细解释： './use
阅读全文
posted @ 2024-03-23 23:06
龙陌
阅读(92)
推荐(0)
摘要：
这段代码是 TypeScript 类型注解，用于定义变量 userInfo 的数据类型。具体解释如下： Record<string, any>：Record<Keys, Type> 是 TypeScript 中的一个泛型类型，表示一个对象类型，其中 Keys 参数指定了对象的键类型，Type 参数指
阅读全文
posted @ 2024-03-23 23:02
龙陌
阅读(252)
推荐(0)
摘要：
在React中，要在表格数据变化后且下一次渲染完成后执行表单校验逻辑，可以考虑在useEffect钩子中处理这个问题。useEffect会在每次渲染完成后的DOM更新之后执行指定的回调函数。 以下是一个简化的示例： import React, { useState, useEffect } from
阅读全文
posted @ 2024-03-23 17:05
龙陌
阅读(204)
推荐(0)
摘要：
算法题 function parseItem(item) { const isNumber = typeof item 'number'; const strItem = isNumber ? String(item) : item; const dashIndex = strItem.indexO
阅读全文
posted @ 2024-03-19 23:55
龙陌
阅读(47)
推荐(0)
摘要：
const renderStartTime = useCallback((text, record, idx, changeTableData) => { return ( <CacheRender dataIndex="startTime" controlRules={() => startTim
阅读全文
posted @ 2024-03-19 09:10
龙陌
阅读(112)
推荐(0)
摘要：
在这里，将tableData添加到useEffect的依赖数组会导致无限循环。因为在useEffect内部更新了tableData状态，每次状态改变又会触发useEffect再次执行，形成无限循环。 解决这个问题的一种方法是，在状态更新时创建一个新的数组，而不是直接修改现有数组。这样就不会触发依赖数
阅读全文
posted @ 2024-03-18 23:44
龙陌
阅读(58)
推荐(0)
摘要：
可编辑表格中的两个列分别是用react-hook-form 和antd的inputNumber实现的，需要在开始时间的列输入后失焦时，或者按enter键，鼠标聚焦到下一列，即结束时间，该如何设置 在React项目中，要实现在一个可编辑表格中，当开始时间列输入后失焦或按下Enter键时，自动将焦点切换
阅读全文
posted @ 2024-03-17 22:43
龙陌
阅读(164)
推荐(0)
摘要：
在使用React的useCallback Hook时，如果直接包裹一个函数而没有提供类型参数，TypeScript会默认认为回调函数的参数类型为any。这是因为useCallback Hook接受两个参数，第一个是回调函数，第二个是一个依赖数组，而TypeScript在没有明确指定类型的情况下无法推
阅读全文
posted @ 2024-03-17 19:31
龙陌
阅读(143)
推荐(0)
摘要：
Wizard Form / Funnel Form 的中文翻译分别是“向导表单”和“漏斗表单”。 向导表单（Wizard Form）：也称为多步骤表单或多阶段表单，是一种分步骤指导用户填写表单的设计模式，如同向导一样带领用户一步一步完成表单填写。 漏斗表单（Funnel Form）：虽然通常“fun
阅读全文
posted @ 2024-03-17 17:35
龙陌
阅读(170)
推荐(0)
摘要：
在代码注释中，除了常见的 TODO、FIXME 和 XXX 外，还有一些其他的特殊注释标签也被开发人员广泛使用，用于标记代码中不同类型的待处理项。以下是一些类似的注释标签： TODO - 表示这里有待完成的任务或者待实现的功能。 FIXME - 指出代码中存在问题或bug，需要修复的地方。 XXX
阅读全文
posted @ 2024-03-17 00:07
龙陌
阅读(2894)
推荐(0)
摘要：
在render里能否直接将field 传递给antd的input 当然可以，在render函数中，可以直接将field对象的部分或全部属性传递给Ant Design的Input组件，这样可以让Input组件完全受控于react-hook-form的Controller组件。 例如，您可以像下面这样简
阅读全文
posted @ 2024-03-17 00:07
龙陌
阅读(385)
推荐(0)
摘要：
对于下拉框的数据获取，是否需要单独拆分出一个hook取决于项目的具体需求和代码组织结构。以下是一些考虑因素： 复用性： 如果项目中多个地方都需要从同一个API或者同一个数据源获取下拉框选项数据，并且处理逻辑相同，那么创建一个专门的hooks用于获取并处理下拉框数据是合理的。这样可以避免代码重复，提高
阅读全文
posted @ 2024-03-16 00:26
龙陌
阅读(119)
推荐(0)
摘要：
关于表单回显和数据绑定的最佳实践，可以遵循以下几点： 双向数据绑定： 使用现代前端框架（如Vue、React或Angular）提供的双向数据绑定功能。例如，在Vue中使用v-model指令实现输入控件与组件状态的自动同步；在React中，可以通过useState hook或者第三方库如react-h
阅读全文
posted @ 2024-03-16 00:07
龙陌
阅读(669)
推荐(0)
摘要：
当然可以。Zustand 作为一个轻量级的状态管理库，非常适合用来作为局部作用域的数据统一存储方案。 相较于 Redux，它更注重简洁性和易用性，并且充分利用了 React Hooks 的特性。 在使用 Zustand 时，你可以创建多个独立的 store 来管理不同组件或模块的本地状态。 每个 s
阅读全文
posted @ 2024-03-15 23:52
龙陌
阅读(351)
推荐(0)
摘要：
在前端开发中，针对后端返回的多变数据结构进行处理以适应页面展示需求的最佳实践包括以下几个方面： 定义清晰的数据模型： 在前端根据UI设计和功能需求明确所需的数据结构，并创建对应的JavaScript对象模型（或使用TypeScript等类型语言提供静态类型检查）。 这有助于前端开发者预先了解并规划如
阅读全文
posted @ 2024-03-15 23:48
龙陌
阅读(528)
推荐(0)
摘要：
前端开发时，应该如何考虑开发的主次先后，比如数据结构、数据流转、UI绘制，js逻辑等等，请给出你的最佳实践 在前端开发中，正确规划和安排各项任务的主次先后对于项目的顺利进行至关重要。以下是一个针对数据结构、数据流转、UI绘制以及JavaScript逻辑等方面的开发优先级与最佳实践建议： 需求分析与设
阅读全文
posted @ 2024-03-15 23:38
龙陌
阅读(282)
推荐(0)
摘要：
是的，一般情况下后端返回的数据结构确实可能与前端需要展示的结构不完全一样。原因有以下几点： 数据库存储结构： 后端从数据库中查询到的数据通常遵循数据库表的设计，包括关系型数据库中的外键关联、嵌套数据等。这些数据可能是为了满足数据库设计规范和查询效率而组织的，并不一定直接符合前端展示的需求。 业务逻辑
阅读全文
posted @ 2024-03-15 23:30
龙陌
阅读(382)
推荐(0)
摘要：
后端返回的数据可能不一定完全符合前端页面展示的需求，这取决于后端API设计和前端UI/UX的设计。 有时后端返回的数据可能是原始数据或者为了满足数据库存储需求的结构化数据，而前端可能需要对这些数据进行处理以便更好地呈现给用户。 数据适配： 如果后端返回的数据结构与前端展示所需不同，那么前端通常需要在
阅读全文
posted @ 2024-03-15 23:27
龙陌
阅读(167)
推荐(0)
摘要：
后端返回的值，不能直接用于表单展示，有的表单项的值是根据其他表单项计算出来的，有的是根据下拉框的选中项的其他属性获取到的，这时候该如何处理？还有最后要保存的时候，传给后端的值，与表单的数据结构也不一样，有的甚至没有放在表单属性上，比如当前下拉框选中的对象而非id，整个需要传给后端 在这种情况下，处理
阅读全文
posted @ 2024-03-15 23:26
龙陌
阅读(103)
推荐(0)
摘要：
当后端返回的数据是多层嵌套结构时，传递给各个Tab和子组件（如表单和表格）可以按照以下步骤进行： 状态管理： 使用React的状态管理库如Redux、MobX或React的Context API来集中存储从后端获取的多层嵌套数据。这样可以确保所有子组件都可以访问到这些数据。 // 使用Redux示例
阅读全文
posted @ 2024-03-15 23:23
龙陌
阅读(182)
推荐(0)
摘要：
如果我使用了react-hook-form，还有必要使用antd的form组件吗？还是直接使用原生的表单组件？例如输入框下拉框？ 使用 react-hook-form 和是否选择使用 antd 的 Form 组件并不互斥，具体取决于你的项目需求和个人偏好。以下是两者结合使用时的一些考量点： Reac
阅读全文
posted @ 2024-03-14 23:19
龙陌
阅读(660)
推荐(0)
摘要：
useImperativeHandle是React Hooks中的一个API，它的主要作用是定制暴露给父组件的子组件实例的引用。 通常与forwardRef配合使用，用于控制哪些属性或方法能够被父组件通过ref获取和操作。 然而，useImperativeHandle并不能直接用来暴露state属性
阅读全文
posted @ 2024-03-14 23:14
龙陌
阅读(373)
推荐(0)
摘要：
export type Primitive = undefined | null | boolean | string | number | symbol; export type DeepRequired<T> = T extends Primitive ? T : keyof T extends
阅读全文
posted @ 2024-03-13 00:08
龙陌
阅读(130)
推荐(0)
摘要：
for( )循环 通过下标，对循环中的代码反复执行，功能强大，可以通过index取得元素。在处理比较复杂的处理的时候较为方便 forEach( )循环 forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。 foreach有的也叫增强for循环，foreach其实是for循环的一个
阅读全文
posted @ 2024-03-10 00:19
龙陌
阅读(1160)
推荐(0)
摘要：
在CSS Modules中，使用Less编译器编译并转换成模块化CSS后，你不需要在JavaScript中通过style.xxx的方式进行嵌套引用。当你在Less文件中使用嵌套语法编写样式时，编译过程会自动将这些嵌套转换为扁平化的类名，并且生成一个映射对象。 例如，在Less文件（假设为styles
阅读全文
posted @ 2024-03-04 19:09
龙陌
阅读(496)
推荐(1)
摘要：
在 TypeScript 中，Pick 和 Extract 是两种不同的类型操作工具。它们分别用于从一个已有的类型中选择或提取部分属性和从联合类型中提取符合条件的类型。 Pick 类型 Pick<T, K> 用于从类型 T 中选取指定的键 K 所对应的属性，创建一个新的类型。 示例： interfa
阅读全文
posted @ 2024-03-04 15:34
龙陌
阅读(206)
推荐(0)
摘要：
有一个子组件DataList,然后在父组件中引入，并在父组件引入中的DataList标签上设置style样式，能生效吗？ 在React中，父组件可以通过props将样式传递给子组件，并在子组件内部应用这些样式。 但直接在父组件引用子组件的地方设置style属性通常不会生效，因为React的JSX语法
阅读全文
posted @ 2024-03-04 15:09
龙陌
阅读(85)
推荐(0)
摘要：
在 TypeScript 中，当你在一个文件中添加 export {} 时，其作用主要有以下几点： 创建模块（Module）： 在 TypeScript 中，每个 .ts 文件都是一个模块。通过添加空的 export {}，即使该文件当前没有实际导出任何内容，也明确地将文件标记为一个模块。 这样可以
阅读全文
posted @ 2024-03-03 10:54
龙陌
阅读(747)
推荐(0)
摘要：
下方数据结构可以被描述为一个JavaScript对象（Object），其中每个键是一个UUID（Universally Unique Identifier），值是一个待办事项对象。 在编程和数据结构领域，这种组织形式没有一个特定的官方名称，但它通常被称为“字典”、“映射”、“关联数组”或“哈希表”。
阅读全文
posted @ 2024-03-02 23:42
龙陌
阅读(167)
推荐(0)
摘要：
pnpm link --global 是 pnpm（一个更快、更节省磁盘空间的 Node.js 包管理器）中的命令，它用于全局链接本地开发的包。 当你在开发一个自定义的 npm 包，并希望在全局环境中像已安装的全局包那样试用它时，可以使用 pnpm link --global 命令。 具体步骤如下：
阅读全文
posted @ 2024-03-02 21:48
龙陌
阅读(3073)
推荐(0)
摘要：
"DRY things up" 这个短语在计算机编程领域中，是一个源自“Don't Repeat Yourself”（简称DRY）原则的概念。 这个原则强调在编写软件代码时应尽量避免重复劳动和复制粘贴代码，提倡将常用或重复的功能抽象成可复用的模块、函数或类。 所以，当说 "DRY things up
阅读全文
posted @ 2024-03-02 21:21
龙陌
阅读(104)
推荐(0)
摘要：
dragable: 默认值为false,可以用于拖拽，但是一个虚拟的。 a标签，img标签默认自带拖拽，(只有chrome,safari可以使用，firefox不支持，ie不支持) 在HTML5中，img标签默认是可拖动的（至少在某些浏览器如Chrome和Safari中）。 当用户尝试拖动图片时，浏
阅读全文
posted @ 2024-03-01 09:41
龙陌
阅读(807)
推荐(0)
浙公网安备 33010602011771号