In Vuetity 2.2 v-autocomplete how can i get selected value using $refs

118 views Asked by At

I am using v-autocomplete component building bit complex complex component where I can not use any property from data. I am using v-model from computed property.

Here I am trying to use $refs to get the value. But I can not fetch it or can not use $refs properly that I have written in scanWarehouseOuter() method.

The this.$refs.inputFromOutside.$el.querySelector("input").value is working good using v-text-field not I am unable to use this in v-autocomplete.

The output from console.log is value = null.

Any help will be appreciated.

<v-autocomplete
    v-bind:solo="solo"
    ref="inputFromOutside"
    :items="location_list"
    prepend-icon="mdi-camera"
    v-bind:outlined="outlined"
    v-model="generatedLocation"
    append-outer-icon="mdi-tools"
    @change="scanWarehouseOuter()"
    @click:prepend="isBarcode=true"
    @click:append-outer="dialog = true"
/>

<script>
export default{
data(){
  location_list:['1-12-7', '1-12-8']
},
generatedLocation: {
  get() {}
  set(value){}
 }
},
methods:{
scanWarehouseOuter(){
  let value = this.$refs.inputFromOutside.$el.querySelector("input").value; // <--- not working
  console.log(value) // = null
 }
}
</script>
0

There are 0 answers