问题描述
我有一个动态图标组件，它是从我正在使用的数据中的字符串中获取其图标的，像这样：
<b-icon :icon="my-icon"></b-icon>
只要我的数据中的my-icon字符串与Bootstrap icons list中可用的字符串匹配，该方法就很好用。但是有时候my-icon是一个完全自定义的字符串，我需要为其创建自定义的SVG。
是否可以选择提供:icon中的<b-icon>道具使用的自定义图标？
还是应该避免在这种情况下使用<b-icon>，而只使用另一种方法来动态提取我的自定义图标以及 Bootstrap图标？
Vue中有这样的东西吗？
<svg class="bi" width="32" height="32" fill="currentColor">
<use :xlink:href="'bootstrap-icons.svg#' + myIcon" />
</svg>
我想我必须构建自己的bootstrap-icons.svg文件-也许我可以弄清楚from their docs。
本质上...
在将图标名称作为道具传递给Vue中的组件时，如何使用图标包和自定义图标？
解决方法
据我所知，无法将自定义SVG暴露给<b-icon>。
您可以改为构建包装<b-icon>的包装程序组件，并将您自己的图标/ SVG合并到其中。
首先检查传入的图标是否与您自己的图标匹配，如果不匹配，则退回到<b-icon>。
或者，您可以查看GitHub存储库上的Bootstrap-Vue creates their icons的情况，并复制此方法以创建自己的自定义组件。