Группирование уникальных объектов и их значений из массива объектов в VueJs - PullRequest
0 голосов
/ 05 июля 2019

У меня есть ответ API REST в виде массива JSON, и я хотел бы заполнить 1 поле выбора в VueJs.

Ответ от API выглядит следующим образом

    "unitList": [
      {
        "unitNumber": "100",
        "block": "1",
        "id": "9a16843a-7e59-11e9-8215-525400a02af1"
      },
      {
        "unitNumber": "101",
        "block": "1",
        "id": "59903bc0-e795-485f-890f-8c488ba9a6ca"
      },
      {
        "unitNumber": "200",
        "block": "2",
        "id": "46f8b6c2-80fe-11e9-b8c0-525400a02af1"
      },
      {
        "unitNumber": "201",
        "block": "2",
        "id": "2532a3b8-ad20-4878-8075-08832c0d7ec9"
      },
      {
        "unitNumber": "202",
        "block": "2",
        "id": "6e539ab3-8da2-4178-8a8e-9d56814a6b9f"
      },
      {
        "unitNumber": "301",
        "block": "3",
        "id": "8cfdc0d1-b39a-4866-9bdb-bf38e84ad338"
      },
      {
        "unitNumber": "302",
        "block": "3",
        "id": "c2cedc40-3292-4746-84bd-f2e563cf3c0e"
      },
      {
        "unitNumber": "303",
        "block": "3",
        "id": "6b7611f5-49c3-448f-920e-00332443698a"
      }
    ]

Вывод в шаблоне vuejs, который я хотел, был выпадающим списком, подобным

    <block>-<unitNumber> with id as value

1 Ответ

0 голосов
/ 06 июля 2019

Простой цикл в шаблоне решил это для меня -

      <select name="block" v-model="block">
        <option
          v-for="blk in unitList"
          :key="blk.id"
          :value="blk.id"
        >{{ blk.block}} - {{ blk.unitNumber }}</option>
      </select>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...