开发手册 欢迎您!
软件开发者资料库

Framework7 - 消息栏

Framework7消息栏 - 从概述,环境,布局,导航栏,工具栏,搜索栏,状态栏,侧面板,内容块,布局网格,叠加层,预加载器,进度条,列表视图,手风琴,卡片,芯片,按钮开始学习Framework7 ,动作按钮,窗体,选项卡,Swiper滑块,照片浏览器,自动完成,选择器,日历,刷新,无限滚动,消息,消息栏,通知,延迟加载,颜色主题,细线,模板概述,自动编译,Template7页面,活动状态,点击保持事件,触摸波纹。

描述

Framework7提供了特殊的可调整大小的工具栏,可以与应用程序中的消息传递系统一起使用.

以下代码显示了消息栏的布局和减号;

               Send   

在消息栏中,"页面"的内部非常重要,位于"messages-content"和"minus"的右侧;

                              Send                                 ... messages         

您可以使用以下方法使用JavaScript : 初始化消息栏;

myApp.messagesbar(messagesbarContainer, parameters)

该方法有两个选项 :

  • messagesbarContainer : 它是必需的HTML元素或字符串,包含消息栏容器HTML元素.

  • 参数 : 它指定一个带有消息栏参数的对象.

例如 :

var myMessagebar = app.messagebar('.messagebar', {   maxHeight: 200});

消息栏参数

maxHeight : 它用于设置textarea的最大高度,并将根据其文本的大小调整大小.参数类型为 number ,默认值为 null .

消息栏属性

下表显示了消息栏属性 :

S.No属性&说明
1

myMessagebar.params

您可以使用传递的初始化参数指定对象.

2

myMessagebar.container

你可以使用messagebar容器HTML元素指定dom7元素.

3

myMessagebar.textarea

您可以使用messagebar textarea HTML元素指定dom7元素.

消息栏方法

下表显示消息栏方法 :

S.No方法&说明
1

myMessagebar.value(newValue);

如果未指定 newValue ,则设置messagebar textarea值/文本并返回messagebar textarea值.

2

myMessagebar.clear();

它清除textarea并更新/重置大小.

3

myMessagebar.destroy();

它会破坏消息栏实例.

使用HTML初始化消息栏

您可以通过将 messagebar-init 类添加到 .messagebar ,使用不使用JavaScript方法和属性的HTML来初始化消息栏,并且可以通过使用 data  -  属性的必需参数.

以下代码指定使用HTML : 的消息栏初始化;

               Send   

访问消息栏的实例

如果使用HTML初始化消息栏实例,则可以访问消息栏实例;它是通过使用其容器元素的 f7消息栏属性来实现的.

var myMessagebar = $$('.messagebar')[0].f7Messagebar;// Now you can use itmyMessagebar.value('Hello world');

您可以看到Messagebar的示例