vue 远程搜索

276 阅读1分钟

html

       <el-autocomplete
            clearable
            v-model="addForm.partyPerson"
            :fetch-suggestions="querySearchAsync"
            placeholder="请输入内容"
            @select="handleSelect"
          >
          </el-autocomplete>

js

	// 自动奖惩人
async getClient(clientName) {
  const { data: res } = await this.$http.post(
    '/modules/auth/accountNameInfo',
    {
      accountName: this.addForm.partyPerson
    }
  )
  if (res.data.length === 0) return this.$message.info(res.msg)
  return res.data
},
// 远程搜索
querySearchAsync(queryString, cb) {
  var result = []
  var b = !!queryString
  if (b) {
    this.getClient(queryString).then(res => {
      result = res
      this.timeout = setTimeout(() => {
        cb(result)
      }, 10)
    })
  } else {
    this.timeout = setTimeout(() => {
      cb(result)
    }, 10)
  }
},
// 远程1
handleSelect(item) {
  console.log(item)
  // this.clientId = item.id
  // this.contactPhone = item.contactPhone
  // this.adress = item.adress
  // if (this.clientId) {
  //   // 选择楼宇
  //   this.getBuildList()
  // }
},