概述
typeahead.js_promise_fix 是一个兼容 Promise 的 typeahead.js 模块。
typeahead.js 本身存在一些问题，例如不能兼容 Promise，或在某些情况下无法兼容某些浏览器。 typeahead.js_promise_fix 正是为了解决这些问题而诞生的。本文将介绍如何使用 typeahead.js_promise_fix。
安装
安装 typeahead.js_promise_fix 可以使用 npm 或直接下载。以下是使用 npm 安装的方法：
npm install typeahead.js_promise_fix
基本用法
typeahead.js_promise_fix 的使用方法与原始的 typeahead.js 类似。以下是一个简单的例子：
-- -------------------- ---- -------
--------- -----
------
------
------------------------
----- ---------------- --------------------------------------------------------------------------------------------
----- ---------------- -----------------------------------------------------------------------------------------------
------- -----------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
------- ----------------------------------------------------------
-------
------
------ ----------------- ----------- ------------------- -- -----
--------
--- ---------------- - -------------- -
------ -------- -------------- --- -
--- -------- ------------
-- -- ----- ---- ---- -- --------- ---- --------- -------
------- - ---
-- ----- ---- -- --------- -- - ------ -------- --- --------- ---
----------- - --- --------- -----
-- ------- ------- --- ---- -- ------- --- --- --- ------ ----
-- -------- --- --------- ---- --- -- -- --- --------- -----
------------ ----------- ---- -
-- ----------------------- -
------------------
-
---
------------
--
--
--- ------ - ----------- --------- ---------- ----------- -------------
----------- -------------- ----------- ---------- ---------- ---------
-------- ----------- ---------- ------- --------- -----------
------------ -------- ----------- ---------------- -----------
------------ -------------- ----------- ---------- -----------
--------- ---- ----------- ---- -------- ---- -------- ---- ------
------ ---------- ------ -------- ------- ----------- ---------
--------------- ------ -------- ------ ---------- ------ --------
------------ -------- ------- ---------- ----------- -------------
----- ---------- ------------ ---------
--
---------------------------
----- -----
---------- -----
---------- -
--
-
----- ---------
------- ------------------------
---
---------
-------
-------在上述例子中，我们只需添加以下代码即可使用 typeahead.js_promise_fix：
<script src="https://unpkg.com/typeahead.js_promise_fix"></script>
可以看到我们的代码与原来的 typeahead.js 几乎相同。但是，我们现在可以使用 Promise 功能了。
高级用法
下面我们将介绍一些 typeahead.js_promise_fix 的高级用法。
自定义 HttpAdapter
typeahead.js_promise_fix 默认使用 jQuery 进行 ajax 请求。但是，如果您希望使用其他的 HttpAdapter，可以使用自定义 HttpAdapter。
以下是一个例子，使用 axios 作为 HttpAdapter：
-- -------------------- ---- -------
--------- -----
------
------
------------------------
----- ---------------- --------------------------------------------------------------------------------------------
----- ---------------- -----------------------------------------------------------------------------------------------
------- -----------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
------- ----------------------------------------------------------
------- ---------------------------------------------------------
-------
------
------ ----------------- ----------- ------------------- ------ -----------
--------
-------- ------------------------ -
------ ------------------------------------------------ -
------- -
-- -----
-
--
------------------------ -
--- --------- - -------------------------------------- -
------ -----------
---
------ ----------
---
--
---------------------------
----- -----
---------- -----
---------- -
--
-
----- ---------------
------- ---------------------------------------
---
---------
-------
-------可以看到，在上面的代码中，我们使用了 axios 作为 HttpAdapter 并定义了 githubHttpAdapter。 通过使用 typeaheadHttpAdapter 函数，我们将自定义的 HttpAdapter 传递给 typeahead.js_promise_fix。
自定义 Formatter
我们还可以自定义 Formatter，将输入的字符串转换为所需的格式。
以下是一个例子：
-- -------------------- ---- -------
--------- -----
------
------
------------------------
----- ---------------- --------------------------------------------------------------------------------------------
----- ---------------- -----------------------------------------------------------------------------------------------
------- -----------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
------- ----------------------------------------------------------
------- ---------------------------------------------------------
-------
------
------ ----------------- ----------- ------------------- ------ -----------
--------
-------- ------------------------ -
------ ------------------------------------------------ -
------- -
-- -----
-
--
------------------------ -
--- --------- - -------------------------------------- -
------ -
------ -----------
----- ----------
------- ---------------
--
---
------ ----------
---
--
--- -------------- - ----- ---------------
---- --------------------
-- ----------
---- -------------------- ---------------- ----------------
-----
-------
---- --------------------
--- ------------------------------------
----------
-------
--------
-------- --------------------- -
------ ------------------------------- ------
-
---------------------------
----- -----
---------- -----
---------- -
--
-
----- ---------------
------- ----------------------------------------
-------- --------
---------- -
----------- ---------------
-
---
---------
-------
-------在上面的代码中，我们添加了一个自定义的 githubFormatter 函数，通过 Mustache.js 来渲染 githubTemplate 模板。最后，通过 templates 属性来传递我们的自定义模板。
结论
通过本文，我们了解了如何使用 typeahead.js_promise_fix，它是一个兼容 Promise 的 typeahead.js 模块。我们还学习了如何使用自定义的 HttpAdapter 和 Formatter，以及模板技术。typeahead.js_promise_fix 能够为我们带来更多的灵活性和更好的体验，值得我们进一步探究和学习。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055aeb81e8991b448d8919