programing

Vuetify 자동 완성 첫 번째 결과만 표시됨

goodsources 2022. 8. 14. 12:27
반응형

Vuetify 자동 완성 첫 번째 결과만 표시됨

검색 방법을 트리거하여 항목 목록을 업데이트할 때 예를 들어 3개의 결과를 로드하면 자동 완성에서는 첫 번째 결과만 표시됩니다.

여기에 이미지 설명 입력 여기에 이미지 설명 입력

아이템 리스트가 100보다 큰 경우(이상 또는 그 이하)에는 2개 이상의 결과만 표시됩니다.

    <v-autocomplete
                box
                v-model="vproveedor"
                :items="itemsAnexos"
                :loading="isLoading"
                :search-input.sync="search"
                hide-no-data
                hide-selected
                item-text="anexDescripcion"
                item-value="anexRuc"
                label="Proveedor"
                placeholder="Busque un proveedor"
                return-object
                >
</v-autocomplete>

<script>
  data: () =>({

        itemsAnexos:[],
        vproveedor:null,
        isLoading: false,
        search: null,
    }),
    watch: {
      search(val) {
        if(!val) this.itemsAnexos = []
        if(!val || this.isLoading || val.length < 3) return

        this.isLoading = true
        axios.get('anexos',{
          params: {
            anexDescripcion : val
          }})
          .then(res => this.itemsAnexos = res.data)
          .finally(() => (this.isLoading = false))
        console.log(this.itemsAnexos)

      },
    },
</script>

언급URL : https://stackoverflow.com/questions/57170328/vuetify-autocomplete-only-show-first-result

반응형