随笔分类 - 问题思考
发表于 2024-02-07 15:27阅读：144评论：0推荐：0
摘要：在 react-dnd 这个库中，"dnd" 是 "Drag and Drop" 的缩写，表示拖拽与放置（拖放）功能。 react-dnd 是一个用于 React 应用程序的强大的拖放库，它允许开发者轻松地在 React 组件之间实现拖放交互功能，从而提升用户界面的互动性和用户体验。 通过使用 re
阅读全文 »
发表于 2024-02-07 10:59阅读：260评论：0推荐：0
摘要：在前端开发时，当需要将用户输入或者动态生成的字符串作为URL的一部分（特别是查询参数或路径片段）发送到服务器时，应当使用 encodeURIComponent 函数对字符串进行编码。 以下是一些具体场景： 查询参数： 当你在URL中添加查询参数（query parameters），例如通过 ?key
阅读全文 »
发表于 2024-02-05 19:39阅读：46评论：0推荐：1
摘要：在React中，命令式行为通常指的是那些直接操作DOM或修改数据源而不通过React的声明式机制（如setState、useState Hook等）的操作。React的核心理念是声明式编程，它鼓励开发者描述UI应该是什么样子，而不是如何改变它。 命令式行为示例包括： 直接操作DOM： 使用原生Jav
阅读全文 »
发表于 2024-02-05 19:38阅读：38评论：0推荐：0
摘要：命令式句柄（imperative handle）是什么意思？ 在计算机科学中，特别是在图形用户界面（GUI）和某些编程语言的上下文中，“命令式句柄”通常指的是对某个对象或资源的一种间接引用。 它是一个特殊的标识符，用于操作对象而不直接访问对象本身。 例如，在Windows API编程中，句柄（Han
阅读全文 »
发表于 2024-02-05 11:56阅读：47评论：0推荐：0
摘要：你不应该从一个 Model 组件暴露出 {open, close} 这样的命令式句柄，最好是像 这样，将 isOpen 作为一个 prop。为什么这样要求？ 在React和现代UI开发中，遵循声明式编程范式通常被认为是一种最佳实践。暴露命令式的句柄（如open和close方法）会导致组件之间产生更紧
阅读全文 »
发表于 2024-02-04 10:52阅读：416评论：0推荐：1
摘要：编写一份前端页面性能分析报告，需要按照一定结构和步骤来详细记录测试过程、数据收集、问题识别与优化建议。以下是一个基本的模板框架： 一、前言 目的：简述报告的目的，比如评估特定网页在不同环境下的加载速度、渲染效率及用户体验。 范围：明确分析涉及的页面及其版本信息，以及使用的设备类型、浏览器版本和网络条
阅读全文 »
发表于 2024-02-04 10:18阅读：19评论：0推荐：0
摘要："与事件处理程序不同，事件处理程序只在每次交互时运行一次，而 Effect 则在需要进行同步时运行。" 但是 交互往往会同时触发事件处理，从而引起值变化，进而导致同步，从而运行Effect，不是吗？ 那么如何确定方法应该写在事件处理里还是Effect里面？？ 事件处理程序（Event Handler
阅读全文 »
发表于 2024-02-04 09:57阅读：2345评论：0推荐：0
摘要：aria-label的作用是什么？ aria-label 属性在网页无障碍（Web Accessibility，简称A11Y）中扮演着至关重要的角色。其主要作用如下： 提供非视觉提示：aria-label 用于为HTML元素提供一个简短、明确的文本描述，这个描述不会在页面上显示出来，但会被屏幕阅读器
阅读全文 »
发表于 2024-02-02 16:59阅读：259评论：0推荐：0
摘要：Vue.js 和 React 在实现响应式原理上有所不同： Vue.js 的响应式机制： 依赖收集（Dependent Data Collection）： Vue 使用了基于 getter/setter 的 Object.defineProperty() 方法，对数据对象的属性进行拦截。当一个组件渲
阅读全文 »
发表于 2024-01-31 19:07阅读：13评论：0推荐：0
摘要：const copyStories = [...stories] 和 let storiesToDisplay = stories.slice(); 两种复制数组的方式，哪种更优雅？ 在JavaScript中，const copyStories = [...stories]（使用扩展运算符）和 le
阅读全文 »
发表于 2024-01-31 16:37阅读：44评论：0推荐：0
摘要：代码越精简的越灵活，还是越冗长的越灵活？ 代码的灵活性并不完全取决于其精简或冗长的程度。 精简的代码通常更容易阅读、理解和修改，从而在一定程度上提高了灵活性。 短小精悍的代码能够更清晰地表达意图，减少出错的可能性，并且易于维护和扩展。 然而，冗长的代码不等于不灵活。有些情况下，为了实现复杂的功能或者
阅读全文 »
发表于 2024-01-31 14:29阅读：3163评论：0推荐：0
摘要：在JavaScript中，unshift() 是数组对象的一个原生方法，它用于向数组的开头添加一个或多个元素，并将原有的数组元素依次向后移动。 这个方法会改变原始数组本身，同时返回新的数组长度。 在英语中，“unshift”不是一个标准的单词，但我们可以将其拆解为“un-”和“shift”。其中：
阅读全文 »
发表于 2024-01-31 14:24阅读：853评论：0推荐：0
摘要：在软件发布中，"Canary" 版本指的是 Canary Channel、Canary Build 或 Canary Release，它通常是指一种高频率更新且可能包含最新（但未经充分测试）功能和改进的版本。 这种版本面向的是愿意接受较高风险并帮助开发者发现潜在问题的用户群体，比如开发者社区、早期尝
阅读全文 »
发表于 2024-01-31 11:54阅读：968评论：0推荐：0
摘要：React.ReactNode 和 React.ReactElement ,更推荐使用哪个？ 在React中，React.ReactNode 和 React.ReactElement 是不同类型，它们适用于不同的场景： React.ReactNode： 类型定义：type ReactNode = R
阅读全文 »
发表于 2024-01-31 09:52阅读：239评论：0推荐：0
摘要：首先，const [count,setCount] = useState(0) 这种语法是ES6的解构赋值语法。 数组在解构赋值时，按照返回的顺序一一解构，并且可以重新命名： const foo = [1,2,3] const [a,b,c] = foo //a=1,b=2,c=3 而对象在解构赋值
阅读全文 »
发表于 2024-01-30 12:07阅读：287评论：0推荐：0
摘要：axios实现，在一个极短时间内，请求同一个接口，若传参完全一样，则使用浏览器中的缓存中的上次的值。同时，上次的值应该在指定时间内可以自动清除。请写一个axios适配器。实现上述功能。 在axios中，我们可以利用浏览器的缓存机制（HTTP缓存）来实现这个需求。不过，浏览器的HTTP缓存主要依赖于服
阅读全文 »
发表于 2024-01-30 11:19阅读：443评论：0推荐：0
摘要：在组织机构管理页面的设计中，左树右表和树形表格都是用来展示具有层级结构数据的有效方式。选择哪种布局取决于具体的使用场景、交互需求和用户体验目标。以下是对两种方式的分析以及最佳实践： 左树右表 优点： 结构清晰：左侧树用于展现层级关系，右侧表格详细展示选中节点下的成员信息或具体属性。 操作方便：用户可
阅读全文 »
发表于 2024-01-30 11:10阅读：21评论：0推荐：0
摘要：这种代码写法有没有问题？ this.$confirm(`是否确认删除名称为"${row.deptName}"的数据项？`) .then(() => { return deleteDept({ deptId: row.id }); }) .then(() => { this.getList(); th
阅读全文 »
发表于 2024-01-30 11:03阅读：138评论：0推荐：0
摘要：删除表格某一行数据后，刷新列表，当前页码需要重置为1吗？给出最佳实践 在删除表格中某一行数据后，是否需要将当前页码重置为1，取决于具体的应用场景和用户体验需求。以下是一些考量因素以及最佳实践： 考量因素： 数据总量与分页逻辑：如果删除操作导致当前页面的数据不足以填充整个页面（例如，删除了最后一页的最
阅读全文 »
发表于 2024-01-30 10:59阅读：56评论：0推荐：0
摘要：在左树右表的场景中，用户修改成功后，数据刷新策略取决于以下几个因素： 数据关联性：如果右侧列表中的数据与左侧树形结构紧密相关，即修改了列表项可能影响到左侧树形结构（例如部门或组织架构中，修改一个用户的属性可能导致其所在部门信息变化），则应同步更新左侧的树。 实时性需求：如果系统要求较高程度的数据一致
阅读全文 »
