首页 > 解决方案 > Vue 2 - 如何从对象内部的数组中获取属性

问题描述

我正在尝试timeTimeMode名为girlsList

<template>
  <div>
    <p>The time property is not displayed</p>
    <ul>
      <li v-for="(item, index) in girlsList.TimeMode" :key="index">
        {{ item.time }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "HelloWorld",

  data() {
    return {
      girlsList: [
        {
          avatarSrc: "https://i.ibb.co/G0nLSQ8/Girl-1.png",
          girlName: "Milena Williams",
          girlTime: "12:00 - 16:00 PM",
          TypeTime: "Cosplay",
          TimeMode: [
            {
              time: 60,
            },
          ],
        },
        {
          avatarSrc: "https://i.ibb.co/qJB12x6/Girl-2.png",
          girlName: "Milena Williams",
          girlTime: "12:00 - 16:00 PM",
          TypeTime: "Cosplay1",
          TimeMode: [
            {
              time: 60,
            },
          ],
        },
      ],
    };
  },
};
</script>

标签: arraysvue.jsfor-loopvuejs2

解决方案


<ul v-for="(i, index) in girlsList" :key="index">
  <li v-for="(item, index) in i.TimeMode" :key="index">
    {{ item.time }}
  </li>
</ul>

推荐阅读