文章/答案/技术大牛

发布

社区首页 >问答首页 >多维数组中的映射对象javascript基于列索引反应原生

问多维数组中的映射对象javascript基于列索引反应原生
EN

Stack Overflow用户

提问于 2020-04-02 08:35:46

回答 1查看 337关注 0票数 0

我有两个历史对象，是播客和文章，我想在同一个屏幕上显示它们被点击的降序，

以下是来自DB的原始文章和播客的变量

var { articles, articlesInHistory, podcastsInHistory, podcasts } = this.props.stores.appStore;

这是我的历史文章中的对象: console.log("dataItem"，articlesInHistory)

dataItem Array [
  Object {
    "currentTime": 1585439646,
    "id": "156701",
    Symbol(mobx administration): ObservableObjectAdministration {
      "defaultEnhancer": [Function deepEnhancer],
      "keysAtom": Atom {
        "diffValue": 0,
        "isBeingObserved": true,
        "isPendingUnobservation": false,
        "lastAccessedBy": 26,
        "lowestObserverState": 2,
        "name": "appStore@1.articlesInHistory[..].keys",
        "observers": Set {},
      },
      "name": "appStore@1.articlesInHistory[..]",
      "pendingKeys": Map {
        Symbol(Symbol.toStringTag) => false,
        "hasOwnProperty" => false,
        "toJSON" => false,
      },
      "proxy": [Circular],
      "target": Object {
        "currentTime": 1585439646,
        "id": "156701",
        Symbol(mobx administration): [Circular],
      },
      "values": Map {
        "id" => "156701",
        "currentTime" => 1585439646,
      },
    },
  },
  ,]

历史播客: console.log("dataItem"，podcastsInHistory)

dataItem Array [
  Object {
    "currentTime": 1585439636,
    "id": "4",
    Symbol(mobx administration): ObservableObjectAdministration {
      "defaultEnhancer": [Function deepEnhancer],
      "keysAtom": Atom {
        "diffValue": 0,
        "isBeingObserved": true,
        "isPendingUnobservation": false,
        "lastAccessedBy": 26,
        "lowestObserverState": 2,
        "name": "appStore@1.podcastsInHistory[..].keys",
        "observers": Set {},
      },
      "name": "appStore@1.podcastsInHistory[..]",
      "pendingKeys": Map {
        Symbol(Symbol.toStringTag) => false,
        "hasOwnProperty" => false,
        "toJSON" => false,
      },
      "proxy": [Circular],
      "target": Object {
        "currentTime": 1585439636,
        "id": "4",
        Symbol(mobx administration): [Circular],
      },
      "values": Map {
        "id" => "4",
        "currentTime" => 1585439636,
      },
    },
  },
]

现在，我想使用currentTime in condition对这两个组件进行排序

例如，如果这个播客是第一个，那么我应该返回

<PodcastList navigate={navigate} podcast={podcast} key={index} />)

或者，如果文章是第一篇，则显示

<SmallArticle key={index} article={article} />

我需要他们混合不像文章顶部和播客底部，我一直在搜索数组排序，但无法解决它。

我想要一个基于currentTime的条件，并使用id来标识或匹配对象，谢谢。

javascript-objects

javascript

reactjs

react-native

multidimensional-array

回答 1

Stack Overflow用户

发布于 2020-04-02 09:10:01

因为你不能从数据中知道它是一篇文章还是一个播客(你的对象中没有属性告诉你这一点)，你不能把它们放在同一个列表数组中。

知道是否应该呈现一篇文章或播客组件的唯一方法是基于您正在阅读的列表。

保留两个索引，articleIndex =0和podcastIndex =0(您可以将其保留在您的状态中)，阅读相应列表的实际文章和播客，并比较当前时间。然后，您将知道要呈现哪个组件，并前进到相应的列表索引。

在伪代码中：

while articleIndex < articlesList.length && podcastIndex < podcastList.length do：

- if articlesList[articleIndex].currentTime < podcastList[pocastIndex].currentTime do:

    - render `<SmallArticle article={articlesList[articleIndex]} key ={articleIndex}/>`//render SmallArticle
    - articleIndex += 1; //advance index

- else do:

    - render `<PodcastList podcast={podcastList[postcastIndex]} key={podcastIndex} />`
    - podcastIndex +=1;

while语句结束时的

，是因为其中一个列表已被完全遍历。您需要遍历其他组件的其余部分，并呈现尊重组件。

如果你给我看一些你的组件代码可以帮助你更详细的代码，但我不知道上下文。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/60982506

复制

相似问题

问多维数组中的映射对象javascript基于列索引反应原生
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问多维数组中的映射对象javascript基于列索引反应原生EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问多维数组中的映射对象javascript基于列索引反应原生
EN