如何在uni-fab上添加自定义图标？

在 UniApp 中，要在 uni-fab (统一浮点按钮) 上添加自定义图标，你可以使用 `<uni-icon>` 组件，并将它的 `name` 属性设置为自定义图标的名字。首先确保你已经在项目中安装了uni-icons库，它包含了大量常用的矢量图标。

1. 安装uni-icons：
在项目目录下运行命令：

   npm install @dcloudio/uni-icons

或者如果是使用yarn：

   yarn add @dcloudio/uni-icons

2. 将自定义图标引入到你的Vue组件中：
在 `components` 目录下创建一个新文件（如：CustomIcon.vue），然后导入自定义图标：

   <template>
     <uni-icon name="custom-icon-name" size="20" />
   </template>
   <script>
   export default {
     components: {},
     props: {
       iconName: String,
     },
   }
   </script>

3. 使用自定义图标：
在uni-fab组件内，将 `<uni-icon>` 的 `name` 属性连接到数据属性上，例如 `activeIcon`：

   <template>
     <uni-fab v-model="activeIcon" position="bottom-right">
       <CustomIcon :name="activeIcon" />
     </uni-fab>
   </template>

4. 当需要更改图标时，更新 `activeIcon` 的值：

   methods: {
     changeIcon(newIconName) {
       this.activeIcon = newIconName;
     },
   }

现在，你就可以通过调用 `changeIcon` 方法并将自定义图标名字传递给它来更改 uni-fab 上的图标了。