bootstrap-vue

问题 I am trying to add an image to the img-src="" attribute of b-carousel in BoostrapVue. The image is currently saved in the asset folder. <b-carousel-slide img-src="../assets/life.jpg"> <h1>Hello world!</h1> </b-carousel-slide> I have added Find below images of the result: I am certain the images are correctly saved in the right location: 回答1: If using a loader with webpack (i.e. vue-loader, url-loader, etc), you need to ensure that the loader knows that img-src accepts a URL. See the docs on

问题 I import all icons (as documentation says): import Vue from 'vue' import { BootstrapVue, BootstrapVueIcons } from 'bootstrap-vue' Vue.use(BootstrapVue) Vue.use(BootstrapVueIcons) When I copy some code from site - icon is working great. This example is ok: <b-icon icon="exclamation-circle-fill" variant="info"></b-icon> But when Im just changing the icon name, it disappears... It looks like some icons does not exist... This doesnt work: <b-icon icon="cart" variant="info"></b-icon> How to fix it

问题 I have a problem with Vue Bootstrap, b-collapse (navbar, sidebar, content) https://jsfiddle.net/Lvkjn7he/1/ When click on navbar-toggler-icon (burger icon) (v-b-toggle="'sidebar-fifi-toggle'") into div b-navbar, the div sidebar collapase (), but the content div remains in its position. <style> #app { width: 500px; } .content { margin-left: 185px; top: 50px; } .sidebar { position: fixed; top: 51px; bottom: 0; left: 0; width: 190px; z-index: 1000; padding: 5px; overflow-x: hidden; overflow-y:

问题 I have a vue bootstrap table that uses custom template for every cell using v-slot. All these cells are a custom component. I want the rows of this table to be sortable, that is, I want the users to be able to drag and drop rows in that table. for this I am using sortable JS. Everything is working fine. But I have a UI distortion in safari when dragging any row in the table. Normal table: table when I am dragging the first row in safari: notice that the last column UI does not look like the

问题 import Vue from 'vue' import App from './App' import BootstrapVue from 'bootstrap-vue' import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap-vue/dist/bootstrap-vue.css' Vue.config.productionTip = false Vue.use(BootstrapVue); /* eslint-disable no-new */ new Vue({ el: '#app', components: { App }, template: '<App/>' }) <template> <div id="app"> <webpage></webpage> </div> </template> <script> import webpage from "./components/webpage" export default { name: 'app', components : { webpage } }

问题 import Vue from 'vue' import App from './App' import BootstrapVue from 'bootstrap-vue' import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap-vue/dist/bootstrap-vue.css' Vue.config.productionTip = false Vue.use(BootstrapVue); /* eslint-disable no-new */ new Vue({ el: '#app', components: { App }, template: '<App/>' }) <template> <div id="app"> <webpage></webpage> </div> </template> <script> import webpage from "./components/webpage" export default { name: 'app', components : { webpage } }

问题 I'm using bootstrap as my design framework and have been using bootstrap-vue. Now I would like to implement some tests to go along with my components. I'm writing a very simple test to make sure a modal is opened. What do I use in vue-test-utils to open the bootstrap-vue modal? I'm using the basics that come with Laravel, bootstrap-vue, vue-test-utils, mocha, and mocha-webpack. I'm trying to open the modal with wrapper.find('#modal-1').trigger('click') . I've tried using a directive <b-button

问题 My end goal is to add a Bootstrap 4 Popover to Full Calendar to display calendar event descriptions, since depending on the view, Full Calendar cuts off the Title/description. Since Full Calendar is generating everything based off of the events prop I pass to it, I haven't been able to figure out how to add a popover of any sort. (I could probably do it with jQuery, but I'm really trying to cut jQuery out of the project to make my build size smaller) There is great documentation here on

问题 My end goal is to add a Bootstrap 4 Popover to Full Calendar to display calendar event descriptions, since depending on the view, Full Calendar cuts off the Title/description. Since Full Calendar is generating everything based off of the events prop I pass to it, I haven't been able to figure out how to add a popover of any sort. (I could probably do it with jQuery, but I'm really trying to cut jQuery out of the project to make my build size smaller) There is great documentation here on

来源： https://stackoverflow.com/questions/51536537/running-jest-with-bootstrap-vue