Vue project city selection page-search logic implementation (8-8)

Search logic implementation

Search for your city based on the characters you enter.
Insert picture description here

  1. First pass the data needed by the search bar from the parent component.
    Insert picture description here
  2. Bind our input box
    Insert picture description here
  3. First set the data to an empty string, then listen to the bound keyword, and add a timer to it to limit the current. The basic idea is to traverse and load the string into the list if it is found
    Insert picture description here
  4. Traverse the list and display the searched cities.
    Insert picture description here
  5. A calculation attribute is set, and if the search fails, it will display "No matching data found"
    Insert picture description here

Guess you like

Origin blog.csdn.net/weixin_45647118/article/details/114295085