uniapp 原生tabbar使用字体图标不起效果。字体图标已配置完成，在vue页面中使用unicode图标可以正常展示。

分类：uni-app

uni_app

"tabBar": {
"color": "#5ce4ff",
"backgroundColor": "#42a0e8",
"selectedColor": "#ffffff",
"list": [
{
"pagePath": "pages/news/index",
"text": "资讯",
"iconfont": {
"text":"&#xe77d",
"selectedText":"&#xe77d",
"fontSize":"20px"
}
},
{
"pagePath": "pages/balance/index",
"text": "余额"
},
]
},

2022-04-23 17:19 负责人:无分享

9 个回复

DCloud_uni-ad_HDX

&#xe 改为 \ue, 例如: "text": "\ue783"

陈文权

生效了，同样遇到这个问题赞

2022-05-07 09:50
友善的程序员

我好想也没生效没啥用

2022-05-19 17:02
j***@foxmail.com

你好，值类似𐃋这样的，怎么去修改呢？我尝试了很久，也没有达到效果。

2022-05-25 12:29
肖建军

回复陈文权: 咋生效的，我们怎么不都行

2023-11-01 14:43
winnnnnnnnner

回复 j***@foxmail.com: 同问

2024-03-10 15:54

DCloud_uni-ad_HDX

注意: 设置 iconfont 属性时，pages.json iconfontSrc 需要指定字体文件，参考下面的配置

// pages.json  
{  
  "tabBar": {  
    "iconfontSrc":"static/iconfont.ttf",  
    "list": [  
      {  
        "pagePath": "pages/index/index",  
        "text": "Tab1",  
        "iconfont": {  
          "text": "\ue102",  
          "selectedText": "\ue103",  
          "fontSize": "17px",  
          "color": "#000000",  
          "selectedColor": "#0000ff"  
        }  
      }  
    ]  
  }  
}

苦逼coder (作者)

加上了还是不可以啊。。。

2022-04-25 10:35

苦逼coder (作者) - 苦逼的coder

"tabBar": {
"iconfontSrc":"static/icon/iconfont.ttf",
"color": "#5ce4ff",
"backgroundColor": "#42a0e8",
"selectedColor": "#ffffff",
"list": [
{
"pagePath": "pages/news/index",
"text": "资讯",
"iconfont": {
// "text":"\ue102",
"text":"&#xe783",
"selectedText":"&#xe77d",
"fontSize":"20px",
"color": "#000000",
"selectedColor": "#0000ff"
}
},
{
"pagePath": "pages/balance/index",
"text": "余额"
},
{
"pagePath": "pages/particulars/index",
"text": "明细"
},
{
"pagePath": "pages/my/index",
"text": "我的"
}
]
},