Vue-添加不带Webpack的CDN组件 | 添加不带Webpack的CDN组件

本文介绍了Vue-添加不带Webpack的CDN组件的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想添加是Github上该组件的链接。

解决方案

您需要先像下面那样注册该组件

 组件：{
自动完成：window [ vuejs-autocomplete] 
}

示例

  new Vue（{el：' #app'，组件：{自动填充：window [ vuejs-autocomplete]}}）

 <脚本src = https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js>< / script><脚本src = http s：//cdn.jsdelivr.net/npm/[email protected]/dist/build.js>< / script>< div id = app> < autocomplete：source = [{id：1，name：'abc'}，{id：2，name：'def'}]>< / autocomplete>< / div>

I want to add this component to my Vue.js project without using webpack.

I've tried adding this to the head:

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/build.js"></script>

And this to the body:

<autocomplete :source="[{id:1,name:'abc'},{id:2,name:'def'}]"></autocomplete>

But the following error happens:

What should I do?

Here's the link to the component on Github.

解决方案

You need to register that component first like below

components: {
   Autocomplete: window["vuejs-autocomplete"]
}

Example

new Vue({
  el: '#app',
  components: {
    Autocomplete: window["vuejs-autocomplete"]
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/build.js"></script>

<div id="app">
  <autocomplete :source="[{id:1,name:'abc'},{id:2,name:'def'}]"></autocomplete>
</div>

这篇关于Vue-添加不带Webpack的CDN组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！