小编Abh*_*ari的帖子

React:使用索引作为列表中项目的键

使用索引作为列表中项目的键有哪些陷阱?在添加或删除列表中的元素时,React 更改检测或任何意外的列表更新是否存在任何性能缺陷。我已经阅读了几篇有关此的文章,但仍然没有弄清楚。

请参考codepen

为什么在列表开头添加项目会导致上述 codepen 出现意外行为?

另外,据说默认情况下,当没有传递键时,react 会传递索引作为键。这意味着不传递任何键并将索引作为键传递 - 两者是同一件事吗?

reactjs

22
推荐指数
2
解决办法
4万
查看次数

Webpack 与 ES6 模块

最近开始学习Webpack。我的理解是,它将各种资源(如 JavaScript、CSS 等)捆绑到捆绑包中。

但是对于 JavaScript,我们不能用 ES6 模块实现相同的功能吗?例如,理想情况下,我们的登陆页面 .html 文件中只能包含一个 module 类型的脚本,并且该脚本模块将以 ES6 方式导入 require 依赖项。

我认为几乎所有现代浏览器都支持 ES6 模块。在这种情况下,Webpack 不是多余的吗?

ecmascript-6 webpack es6-modules

14
推荐指数
1
解决办法
3591
查看次数

角度:将输入值重置为以前的值

在 Angular 2+ 中,是否可以以编程方式将输入的值重置为其先前的值?

我有“选择”下拉列表,因此如果某些验证失败,则选择一个值我需要将其值重置为前一个值。

如何使用 ngModel(模板表单)和 formControl(反应表单)实现相同的效果?(只需要知道这两种方法是否可行)。

我已经发现,如果我们将 ngModelChange 事件放在模板中 select 标记中的 ngModel 之前,那么在 ngModelChange 事件中,我们会在更改之前获得 ngModel 的值。参考:https : //github.com/angular/angular/issues/11234

但我认为这种方法并不简洁,有时可能会令人困惑。

angular-ngmodel angular

5
推荐指数
1
解决办法
3542
查看次数

Angular:在更改另一个表单控件时触发表单控件验证

请在此处参考 stackblitz 中的项目 。

可以看出,我的反应形式的控件为firstNumbersecondNumberthirdNumber。我需要对表单控件进行验证thirdNumber,使其值不应大于在firstNumber和之间具有最小值的表单控件的值secondNumber

validateThirdNumber每当表单控件发生更改时,组件中的自定义验证器都可以正常工作thirdNumber,但我需要对表单控件的更改进行验证firstNumbersecondNumber因为验证逻辑也可以根据表单控件的更改 firstNumber而更改secondNumber

为此,我添加了一个有关表单控件更改的事件firstNumber,并将secondNumber表单控件标记thirdNumbertouched但其验证似乎没有被触发。

那么,如何在表单控件thirdNumber发生变化时触发表单控件firstNumber的验证secondNumber

另外,为什么this.myFormGroup有时在自定义验证器中未定义(请参阅登录于app.componen.tsline:22,即使在绑定this到其表单控件声明并this.myFormGroup在 中定义后也是如此 constructor

angular angular-reactive-forms angular-custom-validators

5
推荐指数
1
解决办法
2万
查看次数

Angular:深度复制反应式形式

我需要制作一个反应式表单的深层副本。我曾尝试使用 ES6 扩展语法来克隆表单。我使用 Typescript 泛型将传播语法的返回值类型转换为FormGroup. 此外,克隆表单变量的类型设置为FormGroup.

但是通过这种方式克隆表单时,克隆的表单变量上的类型丢失了,即不再是 的类型FormGroup。因此,克隆形式不可用。

这是相同的堆栈闪电战:表单克隆

上述克隆方式有什么问题?为什么类型FormGroup在克隆形式上丢失了?

deep-copy angular angular-reactive-forms

3
推荐指数
2
解决办法
8288
查看次数

JavaScript:了解 for 循环内的 let 作用域

请考虑下面的片段-

for(let i = 1; i <= 5; i++) {
   setTimeout(function(){
       console.log(i);
   },100);
}
Run Code Online (Sandbox Code Playgroud)

在这种情况下,内部的日志setTimeout将包含i每个 for 循环迭代的变量值,即日志如下

1
2
3
4
5
Run Code Online (Sandbox Code Playgroud)

为此,我已经阅读了 Internet 上的解释,例如 -let为每个循环创建一个变量声明,这是块级声明。所以基本上它在{ }.

但我对这个说法有点困惑。如果let为每个循环创建一个变量声明,它不会总是1按照循环初始化语句进行初始化let i=1吗?此外,变量i在循环块外声明、初始化和递增,即for循环语句中的花括号。那么,在每次迭代中,不是i增加和使用相同的变量吗?究竟如何let为每个循环创建一个变量声明并具有前一次迭代的值?

javascript scope for-loop let ecmascript-6

2
推荐指数
2
解决办法
1394
查看次数

React 测试库 - 全局配置

我需要覆盖 React 测试库中的默认 testID 属性。使用 Jest 作为测试框架。

为此,我在单个测试文件级别遵循了此处给出的步骤。

有什么方法可以在全局(项目)级别进行此配置,以便项目中的所有测试文件都将遵循此类自定义配置,并且不需要在测试文件级别显式定义自定义配置?

jestjs react-testing-library

1
推荐指数
1
解决办法
3389
查看次数