Я бы реализовал получение данных только на той странице\компоненте где они необходимы. И в зависимости от этого было бы понятно, по какому-то событию на странице или в хуке необходимо получать данные.
Получение реализовал бы через action в хранилище. Что-то типа такого:
getClients ({ commit, dispatch }) {
commit('setLoading', true) // preloader
api.getClients ()
.then((clients) => {
commit('setClients', clients)
dispatch('getKeys')
})
.finally(() => {
commit('setLoading', false)
})
},
getKeys({ commit }) {
commit('setLoading', true)
api.getKeys()
.then((keys) => {
commit('setKeys', keys)
})
.finally(() => {
commit('setLoading', false)
})
}
Соответственно на странице\компоненте вызывался только бы dispatch('getClients ').
А вот получение ключей каждого клиента в разворачиваемую область можно через computed реализовать. И не обязательно загружать будет все ключи, пока кто-то не развернул блок.
P.S> это всё только моё имхо на текущий момент