代码之家 › 专栏 › 技术社区 › user7693832

即使导入BIcon也不要显示引导图标

bootstrap-vue nuxt.js icons vue.js

0

user7693832 · 技术社区 · 4 年前

在我的文本.js引导vue项目:

我跟随github使用引导图标: the link

我的代码:

      <b-icon variant="success" icon="arrow-up"></b-icon>
      <b-icon variant="success" icon="alert-triangle"></b-icon>

      <b-icon icon="alert-circle-fill" variant="success"></b-icon>

      <h2 class="group_title">Anime Wallpapers</h2>

...

<script>

  import { BIcon, BIconArrowUp } from 'bootstrap-vue'

  export default{
    data(){
      return {
        msg: 'hello vue'
      }
    },
    components: {
      BIcon
    }
  }
</script>

但没有出现:

1 回复 | 直到 4 年前

1

4

Troy Morehouse 4 年前

你进口的 BIcon

      <b-icon variant="success" icon="arrow-up"></b-icon>

      <b-icon icon="alert-circle-fill" variant="success"></b-icon>

      <h2 class="group_title">Anime Wallpapers</h2>

...

<script>

  import { BIcon, BIconArrowUp } from 'bootstrap-vue'

  export default{
    data(){
      return {
        msg: 'hello vue'
      }
    },
    components: {
      BIcon,
      BIconArrowUp // <- The icon needs to be registered with your page/app
    }
  }
</script>

请参阅提到需要导入单个图标的文档: https://bootstrap-vue.org/docs/icons#usage