uni-icons组件怎么使用

uni-icons 是一个基于uni-app的图标库组件，可以方便地引入并使用各种图标。

使用方法如下：

1. 在 `pages.json` 中引入 uni-icons 组件：

   "usingComponents": {
     "uni-icons": "@/components/uni-icons/uni-icons"
   }

2. 在需要使用图标的页面中，使用 `<uni-icons>` 标签，并设置 `type` 属性为需要的图标名称，如：

   <uni-icons type="home"></uni-icons>

`type` 属性支持的值可以在 uni-icons 组件的 `icons.js` 文件中找到。

3. 可以通过设置 `size`、`color`、`rotate` 等属性来自定义图标的样式。

如：

   <uni-icons type="home" size="24" color="#333" rotate="90"></uni-icons>

具体属性的使用方法可以查看 uni-icons 组件的文档。

相关问题

如何在项目中引入 uni-icons 组件

要在项目中引入 `uni-icons` 组件，您需要按照以下步骤进行操作：

1. 在 `static` 目录下创建一个新的文件夹，例如 `icons`。
2. 将 `uni-icons` 组件的 CSS 文件和字体文件复制到刚创建的文件夹中。您可以从 `uni-icons` 的官方网站（https://uniicons.co/）下载这些文件。确保您获取到了所需的 CSS 文件和字体文件。
3. 在 `App.vue` 文件中引入 `uni-icons` 的 CSS 文件。可以通过在 `<style>` 标签中添加以下代码来实现：

<style>
@import url("../static/icons/uni-icons.css");
</style>

请注意，如果您将 `icons` 文件夹放在了其他路径下，请根据实际路径进行相应的更改。

4. 现在，您可以在项目的任何组件中使用 `uni-icons` 组件了。例如，在某个组件的模板中，可以这样使用：

<template>
  <view>
    <uni-icons name="home"></uni-icons>
    <!-- 其他内容 -->
  </view>
</template>

请注意，上述示例中的 `name` 属性指定了所需的图标名称。您可以根据需要替换为其他合适的图标名称，并根据实际需求进行样式调整。

以上是引入 `uni-icons` 组件的基本步骤。希望对您有所帮助！如有任何其他问题，请随时提问。

uni-icons 图标 怎么使用 trash-filled 这个图标

uni-icons是一个轻量级的图标库，它基于SVG矢量图，提供了一种简单的方式来添加图标到项目中。如果你想在HTML或Vue等前端框架中使用`trash-filled`这个图标，你可以按照以下步骤操作：

1. **安装**：首先确保已经将uni-icons库引入到你的项目中。如果是通过npm，可以在命令行输入：

   npm install uni-icons

或者通过Yarn：

   yarn add uni-icons

2. **导入图标**：在需要使用的文件中，导入`uni-icons`：

   import { TrashFilled } from 'uni-icons';

3. **使用图标**：然后你可以像这样显示垃圾箱满的图标：

   <i class="uni-trash-filled"></i>

或者如果你是在Vue中，可以绑定一个属性来动态控制：

   <span :class="{ 'uni-trash-filled': isTrashEnabled }"></span>

并在组件内设置`isTrashEnabled`的状态。

4. **CSS样式**：uni-icons通常会提供一些基本样式，但是你也可以自定义样式，例如调整颜色、大小等。

记得替换`<i>`标签内的`uni-trash-filled`为你实际引入的路径或变量名。