Компонент bootstrap-vue отображается как комментарий - PullRequest
Новая
       40

Компонент bootstrap-vue отображается как комментарий

0 голосов
/ 23 января 2019

В моем проекте vue некоторые компоненты bootstrap-vue отображаются нормально, а другие - как комментарий HTML.В этом примере оба компонента хорошо отображаются на панели инструментов Vue Dev.Я добавил "нормальное" поле ввода, чтобы посмотреть, будет ли оно отображено нормально. 

<template>
    <div class="list-group">
        <div>Test</div>
        <b-form-input v-model="text1"
                      type="text"
                      placeholder="Enter your name"></b-form-input>
        <b-form-textarea id="textarea1"
                         v-model="text"
                         placeholder="Enter something"
                         :rows="3"
                         :max-rows="6"></b-form-textarea>
        <input type="text"/>
    </div>
</template>

<script lang="ts">
    import {Component, Vue} from 'vue-property-decorator';

    @Component
    export default class ProjectList extends Vue {
        text = 'text';
        text1 = 'text1';
    }
</script>

Но получится так:

enter image description here

enter image description here

Я бы ожидал увидеть оба поля ввода в браузере, но я вижу только текстовую область и "нормальное" поле ввода.Я не вижу ошибок в журнале.Чего мне не хватать?

1 Ответ

0 голосов
/ 29 января 2019

Хорошо, я нашел решение:

Вместо импорта: 

import Vue from 'vue'    
import BootstrapVue from 'bootstrap-vue'

Vue.use(BootstrapVue);

Я импортирую: 

import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue/dist/bootstrap-vue.esm';

Vue.use(BootstrapVue);

А теперь все отлично работает. Я не уверен, почему, поскольку первый описан в документации по начальной загрузке. Может быть, потому что я использую TypeScript ..?

...