Понадобится функция, которая вложенные массивы развернёт в один плоский:
// есть вариант применить рекурсию
const flat = (arr, childrenKey = 'children') =>
(arr instanceof Array ? arr : []).reduce((acc, n) => (
acc.push(n, ...flat(n[childrenKey], childrenKey)),
acc
), []);
// а можно обойтись и без неё
const flat = function(arr, childrenKey = 'children') {
const result = [];
for (const stack = this(arr); stack.length;) {
const { [childrenKey]: c, ...n } = stack.pop();
result.push(n);
stack.push(...this(c));
}
return result;
}.bind(x => Array.isArray(x) ? [...x].reverse() : []);
Дальше всё просто - вычисляемое свойство,
v-for по его значению:
computed: {
users() {
return flat(this.elements);
},
},
<option v-for="n in users" :key="n.id">{{ n.name }}</option>
