uni-app 使用中导入导航栏的字体图标

uni-app 使用中导入导航栏的字体图标

注意 : 导入的只能放入 放入static文件目录下面

在这里插入图片描述

  • 这里的字体图标使用的是IconFont阿里巴巴矢量图标库
  • 将文件下载好之后 拿出iconfont.ttf文件
    uni-app 使用中导入导航栏的字体图标_第1张图片
  • 放入static文件目录下面 放入static文件目录下面 放入static文件目录下面
    uni-app 使用中导入导航栏的字体图标_第2张图片
  • pages.json中配置
    • uni-app的详细配置
    • fontSrc图片的地址 只能是本地的地址
    • text按钮上显示的文字。使用字体图标时 unicode 字符表示必须 '\u' 开头,如 "\ue123"(注意不能写成"\e123")。
"pages": [
	{
		"path": "pages/index/index",
		"style": {
			"app-plus": {
				"titleNView" : {
					"backgroundColor": "#FFFFFF",
					"searchInput": {
						"borderRadius": "4px",
						"placeholder": "请输入内容",
						"backgroundColor": "#F7F7F7",
						"disabled": true
					},
					"buttons": [
						{
							"color": "#f0e798",
							"float": "left",
							"fontSize": "26px",
							"fontSrc": "/static/iconfont/iconfont.ttf",
							"text": "\ue63c"
						},
						{
							"color": "#000000",
							"float": "right",
							"fontSize": "26px",
							"fontSrc": "/static/iconfont/iconfont.ttf",
							"text": "\ue666"
						}
					]
				}
			}
		}
	}
],

你可能感兴趣的:(Uni-App)