javascript - 在 Vue.js 单文件组件中使用 jQuery 插件

Question

我正在尝试使用 this我的 Vue.js 单文件组件中的 jQuery 插件。

根据链接的自动完成插件的要求，我在 index.html 中导入了引用，以便它们在我需要使用 autocomplete 功能的所有其他 vue 组件中可用 输入字段 .

  <script src="//code.jquery.com/jquery-1.12.4.js"></script>
        <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
        <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

但是当我在我的单个文件组件的脚本标签中包含以下代码时。

 $("#autocomplete").autocomplete({
        source: [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ]
    });

我收到错误控制台说:

> TypeError: $("#autocomplete").autocomplete is not a function. (In
> '$("#autocomplete").autocomplete({
>     source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"] })', '$("#autocomplete").autocomplete' is undefined)

但是我已经在 index.html

中包含了依赖项

Answer 1

Solution: use a component as a wrapper

在这里查看教程: https://vuejsdevelopers.com/2017/05/20/vue-js-safely-jquery-plugin/