时间戳

首页 > 解决方案 > Vue JS - 如果来自两个不同 json 数组的两个字符串匹配，则显示数据

arrays - Vue JS - 如果来自两个不同 json 数组的两个字符串匹配，则显示数据

问题描述

在我的 Vue JS 应用程序中，只有当两个字符串匹配来自两个不同的 json 数组时，我才想显示一个 div。

我正在使用 Axios 来获取两个不同的 json 端点，将它们组合成两个数组并在视图中显示数据。

应该匹配的字符串如下

[
  {
    "info": [
      {
        "uuid": "888"
      }
    ]
  }
]

[
  {
    "postId": "888"
  }
]

我正在使用循环在视图中发布 uuid

<div v-for="posts in $route.params.post.postdata" :key="post.uuid">
<p>{{ post.uuid }}</p>
</div>

和帖子ID

<div v-for="special in specials" :key="special.postId">
<p>{{ special.postId }}</p>

我的详细信息视图

export default {
  data () {
    return {
      loading: false
    }
  },

  computed: {
    specials () {
      return this.$store.state.specials
    }
  },

  created () {
    this.loading = true
    this.$store.dispatch('fetchPosts')
      .then(specials => {
        this.loading = false
      })
  }
}

我需要一个方法和一个v-if？

标签： arraysjsonvue.jsvuejs2vue-component

解决方案

您的示例中有一些命名不匹配，我们不知道路由参数与什么相关。 info没有在任何地方明确使用，也不清楚您正在尝试什么布局。但这是我的猜测，假设外循环代表info

<div v-for="post in $route.params.post.postdata" :key="post.uuid">
   {{ post.uuid }}
   <template v-for="special in specials">
      <p v-if="post.uuid == special.postId">{{ special }}</p>
   </template>
</div>

推荐阅读