示例
1、定義一個(gè)容器 ，建議使用div標(biāo)簽

 <div id="test"></div>

// 模塊加載的機(jī)制不明白的或者加載不進(jìn)來的，請(qǐng)參考layui官方文檔或者自行百度
layui.config({ base: 'js/modules/' }).extend({
  selectInput: 'selectInput/selectInput'
}).use(['form', 'selectInput'], function() {
  var $ = layui.$, form = layui.form, selectInput= layui.selectInput;
           var ins = selectInput.render({
            // 容器id，必傳參數(shù)
            elem: '#test1',
            name: 'test', // 渲染的input的name值
            initValue:'iPhone12 Pro Max', // 渲染初始化默認(rèn)值
            placeholder: '請(qǐng)輸入名稱', // 渲染的inputplaceholder值
            // 聯(lián)想select的初始化本地值，數(shù)組格式，里面的對(duì)象屬性必須為value，name，value是實(shí)際選中值，name是展示值，兩者可以一樣
            data: [
                {value: 1111, name: 1111},
                {value: 2333, name: 2222},
                {value: 2333, name: 2333},
                {value: 2333, name: 2333},
            ],
            url: "https://www.layui.com/", // 異步加載的url，異步加載聯(lián)想詞的數(shù)組值
            remoteSearch: false,// 是否啟用遠(yuǎn)程搜索 默認(rèn)是false，和遠(yuǎn)程搜索回調(diào)保存同步
            // 解析回調(diào)，如果你的異步返回的data不是上述的data格式，請(qǐng)?jiān)诖嘶卣{(diào)格式成對(duì)應(yīng)的數(shù)據(jù)格式，回調(diào)參數(shù)是異步加載的數(shù)據(jù)
            parseData: function (data) {

            },
            error: function (error) { // 異步加載出錯(cuò)的回調(diào) 回調(diào)參數(shù)是錯(cuò)誤msg

            },
            done: function (data) { // 異步加載成功后的回調(diào) 回調(diào)參數(shù)加載返回?cái)?shù)據(jù)

            },
            remoteMethod: function (value, cb) { // 遠(yuǎn)程搜索的回調(diào)函數(shù)
                // value 是input實(shí)施輸入的value值
                // cb是回調(diào)處理函數(shù)，請(qǐng)?jiān)趫?zhí)行ajax搜索請(qǐng)求成功之后執(zhí)行此回調(diào)函數(shù)

                //案例
                //這里如果val為空, 則不觸發(fā)搜索
                if (!value) {
                    return cb([]);
                }
                //這里的$.ajax去請(qǐng)求后臺(tái)拿回?cái)?shù)據(jù)
                $.ajax({
                    method: 'get',
                    url: 'https://www.fastmock.site/mock/98228b1f16b7e5112d6c0c87921eabc1/xmSelect/search',
                    data: {
                        keyword: val,
                    },
                    success: function (data) {
                        return cb(data)
                    }
                })
            }
        }
    });

    // 監(jiān)聽input 實(shí)時(shí)輸入事件
    ins.on('itemInput(test1)', function (obj) {
        console.log(obj);
    });

    // 監(jiān)聽select 選擇事件
    ins.on('itemSelect(test1)', function (obj) {
        console.log(obj);
    });


   // 如果使用本地?cái)?shù)據(jù)加載，不要使用設(shè)置遠(yuǎn)程 url參數(shù) 也不要將remoteSearch參數(shù)設(shè)置為 true，完整的本地賦值數(shù)據(jù)案例

    var ins2 = selectInput.render({
            elem: '#test1',
            data: [
                {value: 1111, name: 1111},
                {value: 2333, name: 2222},
                {value: 2333, name: 2333},
                {value: 2333, name: 2333},
            ],
            placeholder: '請(qǐng)輸入名稱',
            name: 'list_common',
            remoteSearch: false
      });


   // 這是我項(xiàng)目中的需求做的一個(gè)組件，可能存在一些問題，如果有問題可以聯(lián)系我，也可以去碼云提問，有時(shí)間我會(huì)去看的，會(huì)盡量完善這個(gè)組件的

   // 2020-10-23 更新：允許value和name值不同，顯示用name，取值用value；新增參數(shù)initValue，設(shè)置input默認(rèn)初始值
});