el-autocomplete

Integrate el-autocomplete in Vue 3 projects with fetch-suggestions and custom templates.

21|2|Updated Mar 13, 2026
One-click install
npx skills add https://github.com/jiaiyan/element-plus-skills --skill el-autocomplete
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: el-autocomplete
Source: https://github.com/jiaiyan/element-plus-skills/tree/main/components/el-autocomplete
Command: npx skills add https://github.com/jiaiyan/element-plus-skills --skill el-autocomplete

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Element Plus's el-autocomplete helps users find and select from suggestions as they type, reducing manual input and errors.

Core Features & Use Cases

  • Real-time suggestions from local data or remote sources
  • Custom item rendering via slots and templates
  • Supports fetch-suggestions for asynchronous data and remote APIs
  • Applicable in search fields, form inputs, and quick-selection UIs across dashboards and admin panels

Quick Start

Install and configure el-autocomplete in your Vue 3 app, then bind fetch-suggestions to supply options.

Frequently Asked Questions about el-autocomplete

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement real-time input suggestions in Vue 3 using Element Plus?

Real-time input suggestions are implemented in Vue 3 by configuring the el-autocomplete component and binding the fetch-suggestions attribute to supply options dynamically as users type.

Can I use el-autocomplete to fetch asynchronous data from remote APIs?

Yes, el-autocomplete supports fetch-suggestions for asynchronous data retrieval, allowing you to query remote APIs and populate the dropdown list with dynamic options.

What is the best way to customize the dropdown item rendering in el-autocomplete?

Custom item rendering in el-autocomplete is achieved through slots and templates, enabling you to define custom layouts for the suggestions displayed in the dropdown list.

Does el-autocomplete work for form inputs and quick-selection UIs in dashboards?

el-autocomplete works seamlessly for form inputs, search fields, and quick-selection UIs across dashboards and admin panels, reducing manual data entry and input errors.

How do I bind attributes and events in Vue 3 for the Element Plus autocomplete component?

You can bind attributes and events in Vue 3 by aligning with Element Plus API conventions, configuring component properties and slot usages to handle interactions within the autocomplete input.