question-code

question-code

My Template :
<f7-list form>
              <f7-list-item>
                <f7-label>Fruit</f7-label>
                <f7-input type="text" placeholder="Fruit" :id="'autocomplete-dropdown-expand'+_uid"></f7-input>
              </f7-list-item>
</f7-list>

methods:
initAutoComplete: function() {
 let self = this;
                    var autocompleteDropdownExpand = self.$f7.autocomplete({
                          input: '#autocomplete-dropdown-expand'+self._uid,
                          openIn: 'dropdown',
                          expandInput: true, // expand input
                          source: function (autocomplete, query, render) {
                              var results = [];
                              if (query.length === 0) {
                                  render(results);
                                  return;
                              }
                              // Find matched items
                              for (var i = 0; i < fruits.ength; i++) {
                                  if (fruits[i].toLowerCase().indexOf(query.toLowerCase()) >= 0) results.push(fruits[i]);
                              }
                              // Render items by passing array with result items
                              render(results);
                          }
                      });
                  }
  }