【问题标题】:return whole object with updated arrays in reactjs在 reactjs 中返回具有更新数组的整个对象
【发布时间】:2017-08-28 08:41:43
【问题描述】:

我在显示其中包含更新的特征数组的特征对象时遇到问题。对于未触及/未删除的部分,它工作正常,但我删除的功能仅返回功能 数组而不是显示其中包含特征数组的整个对象。我的意思是,如果我有这样的对象

0: Object
feature_description: "Room Amenities"
feature_type: "roomamenities"
features:Array(6)
_id:"59395255455a5b043c764a29"

1:Object
feature_name: "Room Amenities"
feature_type: "bathroom"
features:Array(3)
_id:"59395255455a5b043c764a29"

现在当我删除 roomamenities 特征类型的特征时,我得到以下结果

0:Object
features: Array(5) # 5 not 6 because one item is deleted 

1:Object
feature_name: "Room Amenities"
feature_type: "bathroom"
features:Array(3)
_id:"59395255455a5b043c764a29"

它应该返回以下对象

0: Object
feature_description: "Room Amenities"
feature_type: "roomamenities"
features:Array(5)
_id:"59395255455a5b043c764a29"

1:Object
feature_name: "Room Amenities"
feature_type: "bathroom"
features:Array(3)
_id:"59395255455a5b043c764a29"

如何解决我的问题?

这是我的reducer代码

case UPDATE_REQUESTED_FEATURES_SUCCESS:
  return state
    .update("features", features =>
      state.get('features').map(feature => {
        console.log("feature", feature);
        if (feature.get("feature_type") === "roomamenities") {
          return {
            ...feature,
            features: feature.get("features").map(subFeature => {
              return subFeature.get("_id") !== action.response.data._id;
            })
          };
        } else {
          return feature;
        }
      })
    );

这是reducers通过consoling state.get('features')产生的特征对象的结果

【问题讨论】:

  • 能否请您向我们展示代码中的数据结构,而不是控制台显示的内容?
  • 对不起,我不明白你在说什么数据结构。
  • 在第一部分中,您正在谈论一个对象,但您向我们展示了0: Object [...] 1: Object [...] - 这似乎是一个数组而不是一个对象。请向我们展示 JS 数组或对象格式的数据结构
  • 例如:对象可以显示为{id: "123", text: "Test"},数组显示为["a1", "a2"]
  • @Weedoze 我已经更新了我的问题。

标签: javascript reactjs ecmascript-6 redux immutable.js


【解决方案1】:

您的 feature 对象是 ImmutableJS 映射。所以替换这个:

  return {
    ...feature,
    features: feature.get("features").map(subFeature => {
      return subFeature.get("_id") !== action.response.data._id;
    })
  };

与:

  return feature.set("features", 
      feature.get("features").filter(subFeature => {
          return subFeature.get("_id") !== action.response.data._id;
      })
  );

【讨论】:

  • 如何删除选中的项目?我会试试这个,让你知道
  • 事实上还有一件事要纠正:你的内部.map调用应该是.filter。我刚刚更新了。
  • 这个工作但我的代码不能工作的原因仅仅是因为使用了传播运算符?
  • 是的,展开运算符列出了可枚举的属性,而 ImmatableJS 并没有这样公开它们。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2020-04-06
  • 2019-05-28
  • 2015-11-21
  • 2021-11-29
  • 1970-01-01
  • 2021-08-26
  • 2020-01-16
相关资源
最近更新 更多