EEUI.APP EEUI.APP 首页 文档 - 指南 - 组件 - 模块 插件 - 插件市场 - 开发文档 热更新 控制台 Editor 例子 社区 GitHub 首页 文档 - 指南 - 组件 - 模块 插件 - 插件市场 - 开发文档 热更新 控制台 Editor 例子 社区 GitHub - 模块 - adDialog广告弹窗 - ajax异步请求 - alert对话框 - caches缓存管理 - captcha验证弹窗 - keyboard键盘功能 - loading等待动画 - navigationBar标题栏 - navigationBar.setTitle - navigationBar.setLeftItem - navigationBar.setRightItem - navigationBar.show - navigationBar.hide - navigator路由功能 - newPage页面功能 - openOtherApp打开其他APP - plate复制粘贴 - saveImage保存图片 - getImageSize图片尺寸 - scaner二维码扫描 - share文字图片分享 - storage数据储存 - system系统信息 - toast提示功能 - version版本相关 - weex模块 - animation - clipboard - dom - globalEvent - meta - modal - picker - storage - stream - webview
    # # 导航标题栏

    需要加载的模块

    1. const navigationBar = app.requireModule('navigationBar');
    ## # navigationBar.setTitle - 设置页面标题 
    1. /
    2.   @param params    详细参数
    3.   @param callback  点击标题回调事件，result回调内容为params传入参数
    4.  */
    5. navigationBar.setTitle({params}, callback(result))

    params 参数说明

    属性名 类型 必须 描述 默认值
    title String √ 标题 -
    titleColor String - 标题字体颜色 -
    titleSize Float - 标题字体大小 32.0
    titleBold Boolean - 标题粗体 false
    subtitle String - 副标题 -
    subtitleColor String - 副标题字体颜色 -
    subtitleSize Float - 副标题字体大小 24.0
    backgroundColor String - 标题栏背景颜色 #3EB4FF
    barHeight Number - 标题栏高度 -
    ## # navigationBar.setLeftItem - 设置标题栏左边按钮 
    1. /
    2.   @param params    详细参数
    3.   @param callback  点击按钮回调事件，result回调内容为params传入参数
    4.  */
    5. navigationBar.setLeftItem({params}, callback(result))

    params 参数说明

    属性名 类型 必须 描述 默认值
    title String - 按钮标题（与图标必须一） -
    titleColor String - 按钮标题字体颜色 -
    titleSize Float - 按钮标题字体大小 28.0
    titleBold Boolean - 按钮标题粗体 false
    icon String - 按钮图标，注① -
    iconColor String - 按钮图标字体颜色 -
    iconSize Float - 按钮图标字体大小（图标大小） 28.0
    width Number - 按钮宽度，留空自适应 -
    spacing Number - 按钮标题与按钮图标间距 10

    注①：

    - 支持字体图标，如：md-add、ios-cube，更多图标代码详见eeui所有图标。 - 支持远程图片地址，如：https://eeui.app/app/demo.png，此时不支持iconColor参数。

    简单示例

    1. //示例: 纯文字
    2. navigationBar.setLeftItem({
    3.     title: '按钮1',
    4. }, function(result) {
    5.     //….
    6. });

    综合示例

    1. <template>
    2.     <div class="app">
    3.         <text class="text">EEUI 菜单栏演示</text>
    4.     </div>
    5. </template>
    7. <script>
    8.     const eeui = app.requireModule('eeui');
    9.     const navigationBar = app.requireModule('navigationBar');
    11.     export default {
    12.         mounted() {
    13.             //示例: 图标+文字
    14.             navigationBar.setLeftItem({
    15.                 icon: 'tb-back',
    16.                 title: '返回',
    17.                 width: 120,
    18.             }, function(result) {
    19.                 eeui.closePage();
    20.             });
    22.             //示例: 多个按钮模式
    23.             navigationBar.setRightItem([{
    24.                 icon: 'md-help-circle-outline',
    25.                 iconSize: 32,
    26.                 title: '按钮1',
    27.             }, {
    28.                 title: '按钮2',
    29.                 width: 120,
    30.             }], function(result) {
    31.                 eeui.alert("点击按钮：" + result.title);
    32.             });
    33.         },
    34.     }
    35. </script>
    37. <style scoped>
    38.     .app {
    39.         flex: 1;
    40.         justify-content: center;
    41.         align-items: center;
    42.     }
    43.     .text {
    44.         font-size: 24px;
    45.     }
    46. </style>
    ## # navigationBar.setRightItem - 设置标题栏右边按钮，调用参数同见navigationBar.setLeftItem。 ## # navigationBar.show - 手动显示标题栏，使用navigationBar.setTitle方法时自动显示标题栏。 ## # navigationBar.hide - 手动隐藏标题栏。 在 GitHub 上编辑此页

    最后一次更新: 7/23/2020, 12:01:07 AM

    ← loading navigator →