Vue Component Wrapper for https://harvesthq.github.io/chosen/

chosen-select.js

  Vue.component("chosen-select",{
    props: ['value', 'multiple'],
    template:'<select :multiple="multiple"><slot></slot></select>',
    mounted() {
      var that = this
      $(this.$el)
        .val(this.value)
        .chosen({ width: "100%" })
        .on("change", function(e) {
          that.$emit('input', $(that.$el).val())
        })
    },
    watch:{
      value(val) {
        $(this.$el).val(val).trigger('chosen:updated');
      }
    },
    destroyed() {
      $(this.$el).chosen('destroy');
    }
  })

usage.html

<chosen-select v-model="user" data-placeholder="Choose a user...">
  <option value="1">User 1</option>
  <option value="2">User 2</option>
  <option value="3">User 3</option>
</chosen-select>