uniapp配置app-plus搜索栏
pages.json"pages": [{"path": "pages/index/index","style": {"navigationBarTitleText": "首页","app-plus":{"scrollIndicator": "none","titleNView": {"backgroundColor": "#FFFFFF",// 搜索框"searchInput": {"align
·
pages.json
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页",
"app-plus":{
"scrollIndicator": "none",
"titleNView": {
"backgroundColor": "#FFFFFF",
// 搜索框
"searchInput": {
"align": "center",
"backgroundColor": "#f7f7f7",
"borderRadius": "5px",
"placeholder":"搜索糗事",
"placeholderColor":"#cccccc",
"disabled":true
},
// 按钮
"buttons":[
{
"color":"#fee42a",
"float": "left",
"fontSize": "20px",
"colorPressed":"#cccccc",
"fontSrc": "/static/font/iconfont.ttf",
"text": "\ue606"
},
{
"color":"#303030",
"float": "right",
"fontSize": "20px",
"colorPressed":"#cccccc",
"fontSrc": "/static/font/iconfont.ttf",
"text": "\ue63c"
}
]
}
}
}
}
]
效果图
注意事项
配置按钮为字体
-
我采用的是
阿里图标库 的字体 -
按钮的 fontSrc 路径为你的字体ttf路径
-
按钮的 text 为unicode字体代码
官方明确标明
按钮上显示的文字。使用字体图标时 unicode 字符表示必须 \u 开头
 我们要换成\ue63c 将e后面的截取去除分号;,前面加上\u即可
更多推荐
已为社区贡献2条内容
所有评论(0)