Как обрабатывать массив в массиве или двойные массивы в Vue. Js (Vuex) - PullRequest
0 голосов
/ 30 марта 2020

Может ли кто-нибудь помочь мне с этим сложным массивом? В Интернете я нахожу все города и регионы Украины, и я хочу показать это в теге select-option. Это ссылка для массива. В моем тестовом проекте я отправляю ax ios запрашивает и создает состояние и мутации в Vuex с последующим сохранением. Это мой код из файла Vuex

function initialState () {
const regions = [];
return{
    regions
}}

const getters = {
regions(state)
{
    return state.regions;
}};

async getCity(ctx, data)
{
    return new Promise((resolve, reject) => {
        axios({
            url: 'https://api.hh.ru/areas/5',
            method: 'GET',
            data: data
        })
            .then((resp) => {
                console.log(resp.data.areas)
                ctx.commit('setRegions', resp.data.areas)
                resolve(resp)
            })
            .catch((error) => {
                console.log(error)
                reject(error)
            })
    })
}

const mutations = {
setRegions(state, regions)
{
    state.regions = regions;
}};

В файле компонента Vue я импортирую mapActions и mapGetters И они пытаются обработать этот массив В первый раз я пытаюсь получить только регионы Во второй раз я пытаюсь получить все города, это мой код

<div class="form-group input-group mb-3">
                        <select title="" class="form-control select2 select2-hidden-accessible" style="width: 100%; height: 35px !important;" data-select2-id="1" tabindex="-1" aria-hidden="true">
                            <option selected="selected" disabled>Choose region</option>
                            <option v-for="(region, $index) in regions" :key="$index">{{region.name}}</option>
                        </select>
                    </div>
                    <div class="form-group input-group mb-3">
                        <select title="" class="form-control select2 select2-hidden-accessible" style="width: 100%; height: 35px !important;" data-select2-id="1" tabindex="-1" aria-hidden="true">
                            <option selected="selected" disabled>Choose city</option>
                            <option v-for="(city, $index) in regions['areas']" :key="$index">{{city.name}}</option>
                        </select>
                    </div>

Я не знаю, где моя ошибка С регионами все хорошо, но с городами у меня есть некоторые проблемы, которые они не обсуждают Если у кого-то есть информация, помогите

...