# autoComplete

**Repository Path**: chenc041/autoComplete

## Basic Information

- **Project Name**: autoComplete
- **Description**: 基于 vue的 简单 auto complete 组件
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2018-01-18
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 基于vue的简易 auto complete 组件

> A Vue.js project
> 基于vue的简单自动补全组件

#### 属性
<table>
    <tr>
        <td>属性</td>
        <td>说明</td>
        <td>默认值</td>
    </tr>
    <tr>
        <td>list</td>
        <td>自动完成的数据源</td>
        <td>array</td>
    </tr>
</table>

#### 事件
<table>
    <tr>
        <td>属性</td>
        <td>说明</td>
        <td>参数</td>
    </tr>
    <tr>
        <td>getValue</td>
        <td>获取选中的值</td>
        <td>value</td>
    </tr>
    <tr>
        <td>getSelect</td>
        <td>获取输入框的值</td>
        <td>value</td>
    </tr>
</table>

### 自定义展示内容

```
<AutoComplete
    @select='getSelect'>
    <div class="customeDom">
        <ul>
            <li 
            @click="getValue(item)"
            v-for="(item, index) in list" 
            :key="index">{{item}}</li>
        </ul>
    </div>
</AutoComplete>
```

> demo gif

![Alt text](/screenshot/demo.gif)
## 使用安装

``` bash
npm install or yarn 

# serve with hot reload at localhost:8080
npm run dev or yarn start

```