1.导入外部图标到static/fonts里面,只需要iconfont.css和iconfont.ttf
2.再在app.vue中引入这个css文件@import "@/static/fonts/iconfont.css";
3.然后使用拓展图标,替换self.vue中的以前的图标(使用custom-prefix) //使用的iconfont里面的图标
<uni-icons custom-prefix="iconfont" type="xxm-experiment-fill" size="18" color="#fff"></uni-icons>
然后依次给不同type的进行替换
4.给每个项的图标加入不同的颜色
<view class="icon" style="background-image: linear-gradient(to right,#55f809,#B4F8C8);"> //向右渐变,从一个颜色到另一个颜色