javascript - 拼接后的函数渲染和 setState()
问题描述
我希望我的 React 函数在拼接数组后重新渲染。
这是(部分)功能(使用 Hooks):
function showProblem() {
const [andArray, setAndArray] = useState([]);
const deleteTag = (i, arr) => {
let and = andArray;
switch (arr) {
case "and":
and.splice(i, 1);
setAndArray(and);
break;
default:
return null;
}
};
return(
<div>
{andArray.map((and, i) => {
return (
<span
onClick={() => deleteTag(i, "and")}
key={i}
>
{and}
</span>
);
})}
</div>
)
}
当我单击 SPAN 元素时,我希望我的“andArray.map”再次呈现。
拼接工作正常,我的数组没问题……但函数不会重新渲染。
非常感谢。
解决方案
.splice
改变数组。React 状态必须是不可变的。不变的方式是:
setAndState(and.filter((_, i2) => i2 !== i));
推荐阅读
- algorithm - 按索引映射的函数是否有通用名称?
- python - 如何遍历列表列表,找到相同索引位置的值?
- php - 从字符串中删除除日期之外的所有数字
- android - android Binder调用中的SecurityException到不正确的接口
- c# - EF 使用具有复合键的一对多模型
- java - 通过另一个 List 扩展 ImmutableList.of()
- twitter-bootstrap - 如何在用户图像灰色背景或褪色背景上显示复选框?
- python - 如何从 Django Rest Framework 中的端点导出 PDF
- angular - 如何修复 NgRx Effects 中的执行顺序?
- javascript - React 测试库不会重新渲染