data属性

Posted 2020-08-20 guoDaXia的博客

本框架内置组件以及部分插件可以通过data属性来初始化并使用，通常通过data-toggle来调用API（toggle是触发器的意思，例如我们创建一个navtab标签可以通过为a的data-toggle="navtab"）。如无特殊说明，相关参数也通过data属性传递。

 

data属性无法向JS传递含有大写字母的参数，如果参数是驼峰式（大小写混搭），则需要将大写字母转换为-加小写。如：

reloadWarn ---> reload-warn

maxAndLevel ---> max-and-level

 

data属性示例（打开一个navtab标签）：

<a href="form.html" dato-toggle="navtab" data-id="navtab-form" data-title="表单应用">打开一个表单应用的navtab</a>

等同于下面的js：

$(selector).navtab({id:‘navtab-form‘ ,url:‘form.html‘ , title:‘表单应用‘});

 

selector是符合jquery规范的选择器。

为了方便使用，如无特殊说明，selector可以是任意元素的选择器（不确定或者直接定义在function中，直接使用$(this)即可。如创建navtab： $(‘openTab‘).navtab({id:‘mynav‘,url:‘form.jsp‘,title:‘我的标签‘});   刷新navtab：$(‘freshTab‘).navtab(‘refresh‘,‘mynav‘);