VueJs2自动完成导入但不起作用答案

【问题标题】：VueJs2 Autocomplete imported but not workingVueJs2自动完成导入但不起作用
【发布时间】：2019-10-06 20:31:19
【问题描述】：

我在 Laravel+VueJs 中有一个小型 Web 项目，现在我将它从 VueJs 1.x 迁移到 2。vue-migration-helper 一切都很好，但我的问题在于 vuejsautocomplete 组件。我在谷歌上搜索到 VueJs2 有一个基于 vuejsautocomplete 的 vuejs2autocomplete 库，所以我导入了它，然后使用它，但 mi 自动完成输入无法正常工作。

这是我的 Vue 对象

        var cadApp = new Vue({
            el: '#cadContainer',
            data: {
                inputPrestadorEfector: '',
                frmAfiliado: {
                    inputNumeroAfiliado: '',
                    inputDocumentoAfiliado: '',
                    inputTipoDocumentoAfiliado: '',
                },
                dataAfiliado: {
                    msje:'',
                    contextualClass:'',
                    idUnico:'',
                },//resultado de la consulta
                //prestaciones
                frmPrestaciones : {
                    inputPrestacionCodigo :'',
                    inputPrestacionDescripcion :'',
                },
                dataPrestacion: {
                    msje:'',//no viene en la consulta
                },//resultado de la consulta
                dataPrestaciones: {!! json_encode(old('dataPrestaciones') ?: []) !!},//lista de prestaciones consultadas
                //solicitudes
                frmSolicitud:{

                },
                dataSolicitud: {!! json_encode(old('dataSolicitud') ?: ['idSolicitud'=>0, 'msje'=>'', 'contextualClass'=>'']) !!},
//                {
//                    idSolicitud:0,//0 indica que la solicitud no fue creada
//                    msje:'',
//                    contextualClass:'',
//                },//resultado de la consulta
                solicitudes: [],
                loading: false,
                error: false,
                query: ''
            },
            components: {
                autocomplete: Vue2Autocomplete
            },
            methods: {
......
......

这就是我使用自动完成组件的方式（至少在它工作的第一个版本中）

<div class="input-group-addon">Código:</div>
                        <autocomplete
                                class="form-control"
                                name="inputPrestacionCodigo"
                                placeholder="Código práctica"
                                url="prestacion/codigo"
                                param="CODIGO_PRESTACION"
                                min="2"
                                max="9"
                                limit="50"
                                anchor="CODIGO_PRESTACION"
                                model="frmPrestaciones.inputPrestacionCodigo">
                        </autocomplete>

Vuedevtools 识别两个自动完成组件，但在浏览器控制台中我得到：

[Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <Autocomplete>
       <Root>

【问题讨论】：

请不要发布那么多代码行，只发布重要的部分。没有人会以其他方式看待它。 :)
您可能需要告诉我们究竟什么是行不通的。有什么错误吗？
发布更新...

标签： vue.js vuejs2

【解决方案1】：

经过一番研究，我终于找到了解决方案。向组件注册添加默认值解决了问题：

components: {
            autocomplete: Vue2Autocomplete.default
        },

希望它也可以帮助其他人。

【讨论】：