javascript - svelte react 值不会随商店更改而更新

Question

大家好，我有这个代码来检查是否选择了某个项目

$: checkbox = $chosenPackage.products.find(e => e.id == selectedProduct.product.id && e.name == selectedProduct.product.name)?.variants.some(e => e.id == v.id && e.name == v.name) || false

我 console.log 结果，它总是返回未定义，但是当我在控制台中运行它时，(用重复的对象替换所有商店)它返回正确的值

它之前可以工作，但我必须更改商店的结构，然后它停止工作，标记的行为就像它应该的那样，(checkbox == true 的所有类都被应用)但它不是 react 性的，这意味着当我从数组中删除变体时，它不会删除类，并且当我检查商店时，我看到变体已被正确删除，

当组件重新渲染时，一切看起来都不错，但如果 checkbox 更改，它应该自动重新渲染，并且如果商店中的任何内容发生更改，checkbox 应该自动更改，但它没有't

任何帮助将不胜感激，提前致谢

编辑:我刚刚意识到在另一部分它确实得到了更新

这是更新商店中不起作用的部分的代码

$chosenPackage.products.find(e => e.id == selectedProduct.product.id && e.name == selectedProduct.product.name).variants = [v]

所以我基本上用新选择的变体覆盖整个数组

Answer 1

问题是您在更新分配中使用了方法调用 (find)。一旦存在这样的方法调用，Svelte 就不再将其编译为“更新存储”语句，因为它无法知道该方法的作用以及更新存储是否正确。因此在这种情况下使用 update 方法

chosenPackage.update(current => {
  current.products.find(e => e.id == selectedProduct.product.id && e.name == selectedProduct.product.name).variants = [v];
  return current;
});