I have an array of elements in Vue.js where I need to manipulate some data. For example, I have a select dropdown that displays company information with corresponding tags. These tags are at one sub level and are combined into one before being stored in the database. When I select a parent company, I want the corresponding tags to be selected as well - meaning they should have the class "btn-warning" while the rest should have the class "btn-primary." It's important not to confuse this with other selects, as their options come from the filter of the first select.
For instance, if my tag data value is "Investor-Mutual fund," it should split up so that the "Investor" button is selected and the "Mutual Fund" button has the class "btn-primary." This selection should only be changeable through the select list.
Here's my code pen for reference: https://codepen.io/anon/pen/eWXPaK?editors=1010
This will give you an idea of what I am trying to accomplish. Any guidance would be appreciated.