Problem with selectize, data-binding and vuex

Hello everyone!

I'm very new to vuejs so might be asking something very simple, sorry about that.

I made a component which is basically bootstrap modal. In the modal I want to use selectize (I also tried bootstrap select). The problem is that if the select has some static values it works, while if I fill it with dynamic data it fails with: Uncaught TypeError: Cannot read property 'appendChild' of null

Here is the html:

<div class="form-group">
    <label for="newContactModalType">Type*</label>
    <select id="newContactModalType" name="type_id">
        <option v-for="type in clientTypes" value="{{ type.id }}">{{ type.name }}</option>
    </select>
</div>

And the component:

  export default {
    vuex: {
      getters: {
        clientTypes: state => state.clientTypes.list
      }
    },

    events: {
      'showNewContactModal': () => {
        $('#newContactModal').modal()
      }
    },

    ready() {
      $('#newContactModalType').selectize()
    }
  }

I'm using vuex to get the clientTypes list. As I realize this is where something's wrong, because it works if I define clientTypes in component's data property. I'm not sure where I should call .selectize() too. The best I could think of is the ready() method.

Thanks in advance!