[Vue]ElementUI组件模板之自动完成el-autocomplete

1.原本的input 改为 el-autocomplete
并加上 :fetch-suggestions="querySearch"

<el-autocomplete
  v-model="var"
  :fetch-suggestions="querySearch"
  :placeholder=""
  size="small"
></el-autocomplete>

2.在data中加入一个 restaurants: [],(假设)

  data() {
    return {
      restaurants: [],

3.在method加入这两个函式

  methods: {
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      cb(results);
    },
    createFilter(queryString) {
      return (restaurant) => {
        try {
          return restaurant.value.indexOf(queryString) >= 0;
        } catch (e) {}
      };
    },

4.取api回来将内容存放在 this.restaurants (完成)

    async querylist() {
      const olist = await queryList();
      var _list = olist.data.result;
      _list.map((item, key) => {
        this.restaurants[key] = {
          value: item.name,
        };
      });
    },

完成後应该会出现