移动端级联组件mCascader

移动端开发中可能会涉及到树状数据的选择，由于mui中没有比较好的组件可以使用，所以我基于mui和jq开发了一款可以在移动端操作级联的气泡组件。
源码地址：https://github.com/booms21/mC...

mCascader

mCascader 是一款mui风格的移动端h5气泡级联框，支持可选择任意层级、默认值、分隔符

使用方法：

首先引入mui和jq库，mCascader.css（cascader的样式）

直接调用mCascader方法，并传入配置项：

 mCascader({
     input:'#demo', //对应input的id
     data:data, //mCascader 的数据
     value:[''],//mCascader的默认值,默认值节点的id字符串
     separator:'/', //input中的分隔符
     onClick:function(node){ //当选择完成时的回调函数，node为当前点击的点击的节点
       console.log(node)
     }
   });

input：

对应文本框的选择器，字符串类型

data：

mCascader的数据。Array类型，树结构，data中的节点必须要有以下属性：

 data = [{
   id:'',  // 必须,唯一的id值，String类型
   name:'', //必须,对应mCascader节点的显示文本 ，String类型
   children:[...] //子节点 ，Array类型
    },...]

获取mCascader当前的id值(2种)：

1.mCascader.currtId

2.$('#demo').data('id')或$(mCascader.options.input).data('id')

返回上一层级：

mCascader.back()

清空mCascader数据及重置界面：

mCascader.clear()

例子：

mcascader的DOM不写死到js中，保留了原本组件的结构，方便你自定义组件的样式

    

      

        
          请选择一个节点
      
      

        
无数据
        

      
    

    

      
节点：

      
    
  
  

欢迎你参与贡献！