大家好,我是一个初学者,这个问题困扰了几个小时,所以我正在使用深度嵌套的JSON,每当我更新JSON树深处的值时,useEffect钩子无法识别它,我该怎么做??
下面是我的代码流,所以要更新的值我用这个函数得到它的路径
function findValuePath(data, targetValue, currentPath = "") {
if (typeof data === "object" && data !== null) {
for (let key in data) {
const path = currentPath ? `${currentPath}.${key}` : key;
if (data[key] === targetValue) return path;
const result = findValuePath(data[key], targetValue, path);
if (result) return result;
}
}
}
一旦我有了值路径,我就更新嵌套json中的orderSubstatus
function updateNestedJSON(json, path, value) {
const keys = path.split(".");
let current = json;
for (let i = 0; i < keys.length - 1; i++) {
const key = keys[i];
if (!current[key]) {
current[key] = {};
}
current = current[key];
}
const lastKey = keys[keys.length - 1];
current[lastKey] = value;
return json;
}
以上两个函数的用法如下
function handlePathAndUpdateSelected() {
var temp;
checkedArr.forEach(function (item) {
const data = findValuePath(fetchedData, item);
const cleanup =
data.substr(0, data.lastIndexOf(".") + 1) + "orderSubStatus";
temp = updateNestedJSON(fetchedData, cleanup, 2);
});
setfetchedData(temp);
}
我正在将值从1更改为2(orderSubStatus)
数据得到更新,但是当我使用state设置它时,它不会触发useEffect更改,我怎么可能做到这一点呢?
单击accept all并检查snack Snack here中的控制台日志
1条答案
按热度按时间v1uwarro1#
这与React-Native规则有关。
useEffect
将使用比较器来检查是否有任何状态被更新。当你使用setfetchedData(temp)
,而temp
是fetchedData
的浅层副本时,java-script会认为它们是同一个项目,不会将其视为更改。因此,useEffect()
不会触发。为了解决这个问题,我们通常会使用spread operator(
...
)。它将创建一个全新的副本,该副本不引用编程逻辑中的相同项。