{"id":29240141,"url":"https://github.com/nuochong/vue-auto-complete","last_synced_at":"2026-04-29T07:34:56.124Z","repository":{"id":120938139,"uuid":"247053369","full_name":"nuochong/vue-auto-complete","owner":"nuochong","description":"一个可以自动完成填充的文本框","archived":false,"fork":false,"pushed_at":"2020-12-04T15:24:09.000Z","size":4148,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-07-03T19:10:07.728Z","etag":null,"topics":["auto","complete","input","javascript","vue"],"latest_commit_sha":null,"homepage":"https://vue-auto-complete.luzhaoyang.com","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nuochong.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2020-03-13T11:13:00.000Z","updated_at":"2020-12-04T15:22:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"d0b8ad11-1f40-46ee-a3c1-4a6849bf092b","html_url":"https://github.com/nuochong/vue-auto-complete","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/nuochong/vue-auto-complete","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nuochong%2Fvue-auto-complete","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nuochong%2Fvue-auto-complete/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nuochong%2Fvue-auto-complete/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nuochong%2Fvue-auto-complete/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nuochong","download_url":"https://codeload.github.com/nuochong/vue-auto-complete/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nuochong%2Fvue-auto-complete/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32416146,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-29T06:29:02.080Z","status":"ssl_error","status_checked_at":"2026-04-29T06:29:00.631Z","response_time":110,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["auto","complete","input","javascript","vue"],"created_at":"2025-07-03T19:10:06.871Z","updated_at":"2026-04-29T07:34:56.118Z","avatar_url":"https://github.com/nuochong.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-auto-complete\n\n## 项目安装\n\n```\nyarn add vue-auto-complete\n```\n\n或者\n\n```\nnpm install vue-auto-complete --save\n```\n\n\u003e 温馨提示：暂时未上传到 npm，请 github 下载使用！\n\n## 项目使用\n\nmain.js\n\n```js\nimport AutoComplete from 'vue-auto-complete';\nVue.use(AutoComplete);\n```\n\n### 网络资源\n\n```xml\n\u003cAutoComplete\n  inputClass=\"test-class\"\n  method=\"get\"\n  placeholder=\"请输入搜索内容\"\n  initial-value=\"海阔天空\"\n  :maxlength=\"5\"\n  :showNoResults=\"false\"\n  :show-focus-results=\"false\"\n  results-property=\"result.songs\"\n  results-display=\"name\"\n  source=\"http://musicapi.leanapp.cn/search?keywords=\"\n  @blur=\"onBlur\"\n  @focus=\"onFocus\"\n  @change=\"onChange\"\n  @select=\"onSelect\"\n\u003e\n  \u003cspan slot=\"noResults\"\u003e没有找到\u003c/span\u003e\n\u003c/AutoComplete\u003e\n```\n\n\u003e 温馨提示：示例中网络资源使用第三方网易云接口，由于接口不稳定，会出现无法获取数据等情况。\n\n### 自定函数\n\n```xml\n\u003cAutoComplete\n  inputClass=\"test-class\"\n  method=\"get\"\n  placeholder=\"请输入搜索内容\"\n  :maxlength=\"5\"\n  :showNoResults=\"false\"\n  results-property=\"result.songs\"\n  results-display=\"name\"\n  :source=\"handleSearch\"\n  :clear-button-icon=\"true\"\n\u003e\n  \u003cspan slot=\"noResults\"\u003e没有找到\u003c/span\u003e\n\u003c/AutoComplete\u003e\n```\n\n```js\nexport default {\n  name: 'complete',\n  methods: {\n    handleSearch(value) {\n      let result;\n      if (!value || value.indexOf('@') \u003e= 0) {\n        result = [];\n      } else {\n        result = ['gmail.com', '163.com', 'qq.com'].map((domain) =\u003e `${value}@${domain}`);\n      }\n      console.log('前台处理结果', result);\n      return result;\n    },\n    onBlur() {\n      console.log('失去了焦点');\n    },\n    onFocus() {\n      console.log('获取了焦点');\n    },\n    onChange() {\n      console.log('内容改变了');\n    },\n    onSelect() {\n      console.log('选中时调用');\n    },\n  },\n};\n```\n\n## 可用道具\n\n| 道具             | 类型              | 是否必须 | 默认值     | 描述                                 |\n| :--------------- | :---------------- | :------- | :--------- | :----------------------------------- |\n| source           | `String|Function` | true     |            | 数据资源                             |\n| method           | `String`          | false    | 'get'      | 请求方式                             |\n| initialValue     | `String|Number`   | false    |            | 初始值                               |\n| resultsProperty  | `String`          |          | 'name'     | 输入框默认提示                       |\n| resultsDisplay   | `String|Function` |          | 'name'     | 输入框默认提示                       |\n| placeholder      | `String`          | false    | '搜索内容' | 文本框输入提示                       |\n| maxlength        | `Number`          | false    |            | 输入框默认提示                       |\n| showNoResults    | `Boolean`         | false    | true       | 输入框默认提示                       |\n| showFocusResults | `Boolean`         | false    | true       | 文本框获取焦点后是否显示上次搜索结果 |\n| inputClass       | `String|Object`   | false    |            | 输入框默认提示                       |\n| isUpperLower     | `Boolean`         | false    |            | 输入框默认提示                       |\n| clearButtonIcon  | `Boolean`         | false    | false      | 输入框默认提示                       |\n\n## 可用事件\n\n| 事件   | 输出   | 描述                   |\n| :----- | :----- | :--------------------- |\n| blur   | Object | 失去焦点时的回调       |\n| focus  | Object | 获得焦点时的回调       |\n| change | Object | 输入框数据变化时的回调 |\n| select | Object | 选择下拉列表后的回调   |\n\n## 可用插槽\n\n| 插槽      | 描述           |\n| :-------- | :------------- |\n| noResults | 没有搜索结果时 |\n\n## 项目源码\n\n请浏览[vue-auto-complete](https://github.com/nuochong/vue-auto-complete/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnuochong%2Fvue-auto-complete","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnuochong%2Fvue-auto-complete","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnuochong%2Fvue-auto-complete/lists"}