Currently, while utilizing Vue and vue-bootstrap, I am facing the task of populating a dropdown menu with an array of text items retrieved from my database. The <b-form-select>
component in Bootstrap requires objects of the form
{value: 'some value', text: 'displayed text'}
.
The format of my original array is ['item1', 'item2', 'item3']
.
I am wondering if there is a more efficient method to transform my array into dropdown-friendly objects instead of using a repetitive forEach
loop to manually create each object every time. Currently, my code looks like this:
formatEventTypes() {
this.eventTypes = [];
this.rawEventTypes.forEach(rawType => {
this.eventTypes.push({value: rawType, text: rawType});
});
}
While this approach works for now, it is not optimal especially when dealing with multiple dropdowns.
Any suggestions or insights would be greatly appreciated!