vue项目集成booststrap

1.首先安装bootstrap

npm install bootstrap 

我安装的是4.3的版本

2.在main.js中引用bootstrap 

import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.js'
import 'bootstrap/dist/js/bootstrap.min.js'

3.实例

 

<ul class="list-group list-group-horizontal" v-for="item in data" :key="item.id"  ><li class="list-group-item">{{ item.nid }}</li><li class="list-group-item"> {{ item.name }}</li><li class="list-group-item"> {{ item.price }}</li><li class="list-group-item">{{ item.author }}</li>
</ul>

4.效果