时间戳

首页 > 解决方案 > Vue中从数组中获取数据

javascript - Vue中从数组中获取数据

问题描述

现在，我页面中显示的数据是一个数组，如下所示： 在此处输入图像描述

但我只想获取或显示项目名称。

这是我现在唯一的：

fetch(context,id){
        if(context.getters['isEmpty']){
            Vue.api.mediasetting.index()
                .then(response=>{
                    var medias = response.data[key];

                    context.commit('setMedias',medias);
                    // console.log("init medias", medias[0].project_name)
                },response=>{

                });
        }
    },

我可以在这里应用过滤器吗？如何应用？谢谢。

标签： javascriptarraysvue.js

解决方案

取决于您要用于呈现值的 html 元素，您可以使用v-for 指令来呈现 project_name 值：

<template>
  <ul id="example">
    <li v-for="(media) in medias">
      {{ media.project_name }}
    </li>
  </ul>
</template>

您将需要从商店获取媒体数据，您可以使用计算属性获取它：

<script>
export default {
  computed: {
    medias: function () {
      return this.$store.medias
    }
  }
}
</script>

上面的示例假设您使用的是单文件组件结构。

推荐阅读