Question

我是Vue和Vue cli的新手。我想试试这个vue-tabs-component。我在App.vue中的代码如下：

<template>
  <div>
    <tabs>
        <tab name="First tab">
            First tab content
        </tab>
        <tab name="Second tab">
            Second tab content
        </tab>
        <tab name="Third tab">
            Third tab content
        </tab>
    </tabs>
  </div>
</template>

<script>
import Vue from 'vue';
import {Tabs, Tab} from 'vue-tabs-component';
Vue.component('tabs', Tabs);
Vue.component('tab', Tab);
export default {
  name: 'App'
}
</script>

在浏览器中： screenshot of my demo，以及作者给出的演示： screenshot of author's demo。如你所见，这个组件失去了它的CSS。

我该怎么做才能解决它，请告诉我方式！

Answer 1

您需要的CSS目前可通过以下方式获得：

import 'vue-tabs-component/docs/resources/tabs-component.css';

示例：

import Vue from 'vue';
import {Tabs, Tab} from 'vue-tabs-component';
import 'vue-tabs-component/docs/resources/tabs-component.css';

Vue.component('tabs', Tabs);
Vue.component('tab', Tab);
export default {
  name: 'App'
}

它可能有用，但由于它不在dist文件夹中，我猜，将来可能会将其删除。

Vue.js单个文件组件无法按预期工作

1 个答案: