迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称:xm-select开源软件地址:https://gitee.com/maplemei/xm-select开源软件介绍:xm-select介绍始于Layui, 下拉选择框的多选解决方案 前身前往formSelectes, 由于渲染速度慢, 代码冗余, 被放弃了
软件架构快读上手
1. 引入 `dist/xm-select.js`2. 写一个`<div id="demo1"></div>`3. 渲染 var demo1 = xmSelect.render({ el: '#demo1', data: [ {name: '水果', value: 1, selected: true, disabled: true}, {name: '蔬菜', value: 2, selected: true}, {name: '桌子', value: 3, disabled: true}, {name: '北京', value: 4}, ], })
1. git clone https://gitee.com/maplemei/xm-select.git2. cd xm-select3. yarn 或者 npm install
如果喜欢作者的插件, 可以请作者吃雪糕 ^_^ 示例
<!-- 占位 --><div id="demo1"></div><!-- 引入插件 --><script src="../dist/xm-select.js" type="text/javascript" charset="utf-8"></script><!-- 渲染页面 --><script type="text/javascript"> var demo1 = xmSelect.render({ // 这里绑定css选择器 el: '#demo1', // 渲染的数据 data: [ {name: '水果', value: 1, selected: true, disabled: true}, {name: '蔬菜', value: 2, selected: true}, {name: '桌子', value: 3, disabled: true}, {name: '北京', value: 4}, ], }) // 变量, demo1 可以通过API操作 // 获取选中值, demo1.getValue(); // 设置选中值, demo1.setValue([{ name: '动态值', value: 999 }]) // ...</script> 相关
简单适配IE10以上的版本, 如有其它兼容性问题, 请加群反馈
已经内置到js代码中了, 直接引入
有问题请自己多动手尝试^_^
maplemei, 一个90后, 热爱前端的程序猿16年接触了 贤心大大 的 layui, 开始走向了前端的不归之路17年尝试自己写了一个基于layui的省市区联动插件, 同年底开发了layui select多选第一版18年6月发布了formSelects19年6月发布了xm-select其实每个版本的更新都是自己对前端的一个新的认知, 也是一个新的学习之路目前作者几乎不怎么使用layui, 已经走向了vue, react的新途 , xm-select的维护是对layui的一种情怀 ^_^ ![]() |
2022-08-15
2022-08-17
2023-10-27
2022-09-23
2022-08-13
请发表评论