uni-icons 图标 怎么使用 trash-filled 这个图标
时间: 2024-09-27 07:03:48 浏览: 31
uni-icons是一个轻量级的图标库,它基于SVG矢量图,提供了一种简单的方式来添加图标到项目中。如果你想在HTML或Vue等前端框架中使用`trash-filled`这个图标,你可以按照以下步骤操作:
1. **安装**:首先确保已经将uni-icons库引入到你的项目中。如果是通过npm,可以在命令行输入:
```
npm install uni-icons
```
或者通过Yarn:
```
yarn add uni-icons
```
2. **导入图标**:在需要使用的文件中,导入`uni-icons`:
```javascript
import { TrashFilled } from 'uni-icons';
```
3. **使用图标**:然后你可以像这样显示垃圾箱满的图标:
```html
<i class="uni-trash-filled"></i>
```
或者如果你是在Vue中,可以绑定一个属性来动态控制:
```vue
<span :class="{ 'uni-trash-filled': isTrashEnabled }"></span>
```
并在组件内设置`isTrashEnabled`的状态。
4. **CSS样式**:uni-icons通常会提供一些基本样式,但是你也可以自定义样式,例如调整颜色、大小等。
记得替换`<i>`标签内的`uni-trash-filled`为你实际引入的路径或变量名。
阅读全文