Код: Выделить всё
Field 1
[url=#]{{ suggestion }}[/url]
[/list]
const AutoCompleteComponent = {
data: {
open: false,
current: 0
},
methods: {
... omitted for brevity ...
},
computed: {
//Filtering the suggestion based on the input
matches() {
return this.suggestions.filter((str) => {
return str.indexOf(this.selection) >= 0;
});
},
//The flag
openSuggestion() {
return this.selection !== "" &&
this.matches.length != 0 &&
this.open === true;
}
},
template: "#vue-auto-complete-template"
}
export default AutoCompleteComponent;
< /code>
Я попробовал два способа добавления его в основное приложение, ни один из них не работает: < /p>
import AutoCompleteComponent from "./AutoCompleteComponent.js";
import * as vue_core from "/node_modules/vue/dist/vue.esm-browser.js"
const app = {
data() {
return {
message: 'Hello Vue!',
cities: ["Prague", "Brno", "Krakow", "Berlin"],
selectedCity: ""
};
},
template: "#vue-select-station-template",
// this is what makes more sense to me, registering it before calling createApp
components: {AutoCompleteComponent}
};
const vueApp = vue_core.createApp(app);
// tried this too, it did not help
vueApp.component("AutoCompleteComponent", AutoCompleteComponent);
vueApp.mount('#vue-app');
< /code>
Ошибка, которую я получаю: < /p>
[Vue warn]: Failed to resolve component: autocompletecomponent
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
at
< /code>
Я хочу, чтобы все это было простым JS и HTML без какого -либо транспортировки, поэтому я использую упакованный VUE и напрямую добавил исключение из HTTP -сервера, чтобы разрешить его загружать из node_modules < /code>.
Подробнее здесь: https://stackoverflow.com/questions/794 ... -component