对layui tree 和输入框结合扩展 treeSelect

最新推荐文章于 2024-06-28 03:45:22 发布

Gavin~

最新推荐文章于 2024-06-28 03:45:22 发布

阅读量9.5k

点赞数

分类专栏： layui js 文章标签： layui

本文链接：https://blog.csdn.net/qq_20448967/article/details/80925967

版权

本文介绍如何扩展layui的tree组件，创建一个与输入框结合的treeSelect功能。提供了具体的效果图和使用方法。

摘要由CSDN通过智能技术生成

扩展lyaui的组件效果图如下

用法如下：

<input type="text"  id="treeSelect" autocomplete="off" class="layui-input " >

js:

treeSelect.render({
    elem:"#treeSelect",
    url:"portal",
    type:'GET',
    done:(data)=>{
        if(!!data){
            $("#treeSelect").val(data['name']).attr("data-id",data['id'])
        }
    }
})

treeSelect.js 的组件的封装：

//自定义异常
class treeSelectError extends Error {
    constructor(message) {
        super(message);
        this.name = "treeSelectError";
    }
}

///对输入框和tree 座做一个结合的扩展
layui.define(["tree", 'jquery', 'ajax', 'form'], (exports) => {

    let